ngValue 返回索引和值

使用 [ngValue] 从选择返回的值是索引和值的串联

如果我用这个

<select (change)="selectType($event)" name="type" >
    <option *ngFor="let type of types" [ngValue]="type.value" >{{type.display}}</option>
</select>

然后我用它来获取所选选项的值

selectType (e) {
    this.type = e.target.options[e.target.selectedIndex].value;
}

我的价值观是这样的

0: type1
1: type2
2: type3
...

我怎样才能得到这个值？ ngValue 似乎将索引和值放入 value 参数中。

由于您正在处理changeDOM事件，参数$event is the 事件对象 https://developer.mozilla.org/en-US/docs/Web/API/Event由 DOM 提供，而不是设置的选项值ngValue.

如果您处理了ngModelChange角度事件代替，参数$event将是期权的价值。您还可以使用双向绑定ngModel如果你只需要设置的值type在组件类中。

以下是各种选项。你可以尝试一下这次堆栈闪电战 https://stackblitz.com/edit/angular-lxkktf.

1. 将事件目标的值传递给selectType:

    <select (change)="selectType($event.target.value)" name="type">

2. 使用双向绑定设置值ngModel（没有selectType):

    <select [(ngModel)]="type" name="type">

3. 处理ngModel and ngModelChange单独进行（如果在selectType):

    <select [ngModel]="type" (ngModelChange)="selectType($event)" name="type">