添加动作，以在选择选项（角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) }