代码之家 › 专栏 › 技术社区 › POV

如何将函数绑定到对象属性?

angular7 angular

0

POV · 技术社区 · 6 年前

public add() {}
public delete(item: Ivoice) {}

    this.invoices = data.map(item => {
            item.add = this.add;
            item.edit = this.delete;
            return item;
   });

然后在模板中,我尝试调用方法为:

<div *ngFor="let item of items; let i = index">
  <span (click)="item.add(item)">
</div>

但它不起作用。

2 回复 | 直到 6 年前

1

Syed Ali Naqi 6 年前

最简单的方法是:

public void executeClickOrSomething(YourType type){
    type.add(type)
}

然后可以在模板中执行以下操作:

<div *ngFor="let item of invoices; let i = index">
  <span (click)="executeClickOrSomething(item)">
</div>

建议: 对于复杂的场景,总是有不同的方法。虽然这听起来不那么复杂,但Angular仍在开发中,所以也许他们会在未来修复它。。。

如果您正在考虑更改原始数据源/数组(在本例中),那么您也应该覆盖该数据源/数组中的元素。。

2

1

user6576367 user6576367 6 年前

item.add = this.add;
item.edit = this.delete;

您基本上是将函数/方法引用分配给 item 项目 项目

你可以用 bind method 要避免此问题,请执行以下操作:

item.add = this.add.bind(this);
item.edit = this.delete.bind(this);