javascript - 带参数和返回值的Angular 2 Click事件

这个对我的通用javascript函数“ openTab”的硬编码调用有效，并且openTab的返回值为false，因此代码将更改/显示选项卡而无需提交表单。

<button class="tablinks" onclick="return openTab(event,'tab1');">Tab 1</button>

一旦使这种动态变化，我就会遇到几个错误：

<ng-container *ngFor="let option of question.options">
    <button class="tablinks" (click)="return openTab(event, option.tabId);">{{ option.tabName }}
</ng-container>

上面的代码是我试图到达的位置，但是解析器不喜欢使用“（click）= return”，并且当我删除返回时，我得到一个异常“ _co.openTab”不是一个函数。

这是我尝试过的事情：

<button class="tablinks" onclick="return openTab(event, 'tab1');">{{ option.tabName }}</button>

上面的作品，但ID是硬编码的，tabName是动态的。

<button class="tablinks" onclick="return openTab(event, {{option.tabId}});">{{ option.tabName }}</button>

上面的代码给出以下错误：出于安全原因，不允许绑定到事件属性'onclick'，请使用（click）= ...

<button class="tablinks" (click)="return openTab(event, {{option.tabId}});">{{ option.tabName }}</button>

上面的代码由于返回而无法解析：解析器错误：意外的令牌

<button class="tablinks" (click)="openTab(event, option.tabId);">{{ option.tabName }}</button>

上面的代码进行了解析，但是当您单击按钮时，您得到：TypeError：_co.openTab不是函数

<button class="tablinks" (myClick)="openTab(event, option.tabId);">{{ option.tabName }}</button>

上面的代码进行了解析，但是当您单击按钮时没有任何反应，不会调用openTab，没有错误

有什么建议么？

最佳答案

语法为$event：https://angular.io/guide/user-input#get-user-input-from-the-event-object。以下应该工作：

<button (click)="openTab($event, option.tabId)"></button>

请注意，openTab方法必须在组件类上是公共的。

关于javascript - 带参数和返回值的Angular 2 Click事件，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/49566792/