添加動作，以在選擇選項（角4）

Question

我想角執行功能「onEditClick」當一個特異性選項，用戶點擊，這是我的代碼：

<select class="form-control"> 
    <option *ngFor="let skill of skills" (click)="onEditClick(skill)" >{{ skill.name }}</option> 
</select> 

當我點擊任何一個選項，什麼都沒發生。

我試圖用一個表，而不是選擇做它和它的工作：

<tbody *ngFor="let skill of skills"> 
    <td> {{ skill.name }} </td> 
<td><button class="btn btn-outline-success" height="20" width="20" (click)="onEditClick(skill)">Edit</button></td> 
</tbody> 

我怎樣選擇一個做呢？

Answer 1

Click事件不是選擇有效的選項，你應該再使用改變事件

<select class="form-control" (change)="onEditClick($event.target.value)"> 
    <option *ngFor="let skill of skills"> 
     {{ skill.name }} 
    </option> 
</select> 

在組件做一些與

onEditClick(skill: any) { console.log('skill name', skill) }

您還可以通過其他一些參數技能對象作爲像id一樣的值，使用[value]="skill.id"

<option *ngFor="let skill of skills" [value]="skill.id">

但是，如果你想獲得全技能對象也許你可以做到這一點與[（ngModel）和（變化），像這樣：

<select class="form-control" [(ngModel)]="selectedSkill" 
(change)="getSelectedSkill()"> 
<option *ngFor="let skill of skills" [ngValue]="skill"> 
    {{ skill.name }} 
</option> 
</select> 

，比你的組件：

selectedSkill: any

getSelectedSkill(){ console.log(this.selectedSkill) }