angular - 动态(点击)功能 - Angular2

Question

我在将动态函数绑定(bind)到点击事件时遇到了一些麻烦。请看下面:-

文件 1

<title-bar [actions]='[{title: "Create A New Plan", link: "hello"}]' ></title-bar>

文件 2

<div class="actions" *ngIf="actions">
    <a *ngFor="let action of actions" class="ui primary button" (click)="[action.link]()">{{action.title}}</a>
</div>

除了我在(单击)中绑定(bind) action.link 之外，所有代码都运行良好。

如果我创建以下按钮:-

<button (click)="hello()"></button>

它按原样调用 hello() 函数。但出于某种原因，我无法让它动态工作。

对于这个我可能忽略了的问题，有人有简单的解决方案吗？

该函数调用一个简单的警报只是为了测试:-

public hello() {
    alert('test');
}

我曾尝试将点击事件更改为以下内容，但没有成功:-

(click)="action.link"
(click)="[action.link]()"
(click)="this[action.link]()"

我分别得到以下错误:-

No error, but not function called
inline template:3:2 caused by: ["hello"] is not a function
inline template:3:2 caused by: self.parentView.parentView.context[self.context.$implicit.link] is not a function

我们将不胜感激任何插入正确方向的帮助。

Answer 1

在你需要的组件中

get self() { return this; }

在模板中

<a *ngFor="let action of actions" class="ui primary button"
  (click)="self[action.link]()">{{action.title}}</a>

<罢工>

使用

<a *ngFor="let action of actions" class="ui primary button"
  (click)="this[action.link]()">{{action.title}}</a>