如何使用Angular 6在HTML元素上结合动态函数

Question

我正在尝试在动态创建的元素上绑定事件。我很成功，但我无法将功能绑定到事件。这是我的代码

.ts代码

 data = ['fn1()', 'fn2()', 'fn3()'];
 fn1() { alert(1) }
  fn2() { alert(2) }
  fn3() { alert(3) }

html代码

   table>
  <ng-container *ngFor='let d of data'>
    <tr (click)=d>
      <td>
        :) !!!
      </td>
    </tr>
  </ng-container>

但是，当我静态地添加函数时，它被调用，即。

<table>
  <ng-container *ngFor='let d of data'>
    <tr (click)=fn1()>
      <td>
        :) !!!
      </td>
    </tr>
  </ng-container>
</table>

这有效，有人可以帮助我吗？

Answer 1

您想要一个功能数组，而不是字符串。并且您想在单击DIV时调用该功能：

打字稿：

fn1 = () => { alert(1) };
fn2 = () => { alert(2) };
fn3 = () => { alert(3) };
data = [this.fn1, this.fn2, this.fn3];

html：

<div (click)="d()">

demo