动态(点击)功能-Angular2 [英] Dynamic (click) function - Angular2

问题描述

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

I am having a little trouble with binding a dynamic function to a click event. Please see below:-

文件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时相比，所有代码都运行良好.

All of the code is working perfectly apart from when I am binding the action.link in the (click).

如果我创建以下按钮:-

If I create the following button:-

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

它会按需调用hello()函数.但由于某种原因，我无法使其动态工作.

It calls the hello() function as it should. but for some reason I am not able to get this to work dynamically.

有人对此有一个简单的解决方案吗?

Does anybody have a simple solution to this I may have over looked?

该函数正在调用一个简单的警报，仅用于测试:-

The function is calling a simple alert just for testing:-

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

II试图将click事件更改为以下内容，但并不高兴:-

II have attempted to change the click event to the following but with no joy:-

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

我分别遇到以下错误:-

I get the following errors respectively:-

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

在正确方向上进行的任何帮助将不胜感激.

Any help with a push in the right direction will be very much appreciated.

推荐答案

您需要的组件中

In the component you need

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>

这篇关于动态(点击)功能-Angular2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！