Angular 4 动态添加点击事件答案

【问题标题】：Angular 4 Dynamically add a click eventAngular 4 动态添加点击事件
【发布时间】：2017-09-18 09:20:32
【问题描述】：

我需要给一个div标签动态添加点击事件：

<div *ngIf="item.click">
    <div (click)="item.click" >{{item.name}} (should trigger( {{item.click}})</div>
</div>

我的对象如下所示：

item: {name: 'Action', click: '_actionService.triggerAction()'}

运行代码时我没有收到任何错误，但似乎没有创建点击事件。

有什么建议吗？

【问题讨论】：

我不太确定这是否可能如果我错了会很高兴
无法使用 Angular 绑定动态添加点击处理程序。而是做类似(click)="item.click ? doSomething($event) : null" 的事情，只在item.click 为真时用户点击时才调用doSomething()。
我不确定(click)="item.click" 应该做什么（它不会像目前那样做任何事情）
应该是触发函数_actionService.triggerAction()
这不是它的工作原理，为什么不在item元素上定义真正的函数而不是字符串？

【解决方案1】：

我认为添加动态点击没有任何问题。但是，您的项目应该是这样的：

item: {name: 'Action', click: '_actionService.triggerAction'}

所以，item 中的 click 属性是函数而不是结果。 _actionService.triggerAction() >>> _actionService.triggerAction

然后html应该是这样的：

<div (click)="item.click.call()" >

希望对您有所帮助！

这是我尝试过的实际代码：

组件：

 ... implements OnInit {

  public item: any = { name: 'name', click: () => { console.log('Some clcik has happened') } }

...

html：

<div (click)="item.click.call()"></div>

【讨论】：

感谢您的回复，但这不起作用。我收到一个错误：“v.parent.context.$implicit.click.call 不是函数”
_actionService.triggerAction 是一个函数吗？在这种情况下，您可以发布更多代码，以便我们检查问题出在哪里
谢谢你！通过您的编辑，我可以使用“ item: {name: 'Action', click: () => {this._actionService.triggerAction()} )”