动态(单击)功能 - Angular2

Question

将动态函数绑定到click事件时遇到一些麻烦.请看下面: -

档案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>

除了在(点击)中绑定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>