如何在 angular 5 中的下拉菜单中选择不同的选项时调用不同的函数

Question

要使用许多下拉菜单。要求是当从下拉列表中选择一个选项时，需要调用相应的自定义函数，如下所示应该代替 opt.mtd 因为它不起作用

html

<li class ="dropdown"> 
<div id="name">Activities</div>
<li *ngFor="let opt of activityList">
<a (click)=opt.mtd>{{opt.name}}</a>
</li>
</li>

组件

export class..{

activityList=[{mtd:"getActivity1()", name:"cycling"},
{Mtd:"getActivity2()", name:"swimming"}]

Answer 1

在您的示例中，mtd 的值只是一个字符串。您需要传递实际功能。

function getActivity1() {...};
function getActivity2() {...};

activityList=[
    {mtd: getActivity1, name:"cycling"},
    {mtd: getActivity2, name:"swimming"}
]

另外，把赋值后的()去掉，这里的函数你不想执行，你只是想赋值给后面(click)使用。

如何在 angular 5 中的下拉菜单中选择不同的选项时调用不同的函数

How to call different function on selecting different option from drop down in angular 5

html

angular

typescript1.7