单击而不是更改时激活选择器上的触发器

Question

目前我正在做一个 Angular 项目。

我想创建一个选择按钮，当我单击其中一个选项时，它会在我的 .ts 文件中调用一个函数。它必须与它一起发送选择的选项。

现在我正在使用以下代码：

在我的 HTML 中

<select class="btn add" (change)="onChange($event.target.value)">
    <option value="" disabled selected>Choose...</option>
    <option *ngFor="let option of listOfOptions >{{option}}</option>
</select>

在我的 .TS 中

private listOfOptions = ['delete'];

以及必须触发的功能。

onChange(option) {
    if(option = 'delete') {
      console.log('Triggered delete!');
  }
}

如您所见，目前我正在使用 (change) 事件。但是，当它处于“删除”状态时，您将再次单击“删除”，那是行不通的。因此，我想将其更改为（单击）。但是当我这样做时，它会在打开选择器时触发，而不是在选择选项时触发。

如何让它在我选择选择器内的选项时触发，而不是选择器本身？

Answer 1

将change 监听器放在select 标记上。

<select (change)="onChange(...)">

Answer 2

你可以这样做：

<option (click)="yourFunction()">

你可以输入一个参数，这样你就可以看到被点击的选项。