如何在Angular 5

时间:2018-03-13 21:58:30

标签: angular

我是棱角分明的新人。我正在使用角度5.我知道你可以做这样的事情

<div (click)=foo()>click me</div>

表示在单击元素时调用组件类中的foo()方法的angular。如果您想要动态地将方法传递给(click)该怎么办,也就是说,您不知道在构建视图时将(click)分配给<ul> <li *ngFor="let item of items" (click)=item.action>item.name</li> </ul> 的内容如下所示

let items = [
    {name: 'Smith', action: 'add'},
    {name: 'Paul', action: 'delete'}
]

让我们假设items数组看起来像这样

li

我想点击包含Smith的add()元素来调用delete()方法,然后点击包含Paul的方法来调用get()方法。我如何实现这一目标?

1 个答案:

答案 0 :(得分:1)

你可以试试这个

let items = [
    {name: 'Smith', action: () => { console.log('add');} },
    {name: 'Paul', action: () => { console.log('delete');} }
]


<ul>
    <li *ngFor="let item of items" (click)="item.action()">items.name</li>
</ul>

即使您可以在函数中使用参数

    {name: 'Smith', action: (somearg) => { console.log('add', somearg);} },

    <li *ngFor="let item of items" (click)="item.action(argvalue)">items.name</li>