angular - 如何在没有双向数据绑定(bind)的情况下从 Angular2 中的 "Select"获取选定对象

Question

我正在尝试创建一个包含对象列表的下拉列表。由于包含其他选项的下拉列表，它不能双向绑定(bind)到数组。在选择时我想将对象传递给组件，但目前我只能传递显示值。

这是我的模板:

    <select (change)="doSomething($event.target.value)">
        <option disabled selected>Please select...</option>
        <option *ngFor="let item of items" [ngValue]="item">{{ item.description }}</option>
        <option [ngValue]="">None of the above</option>
    </select>

以及组件中的函数:

    doSomething(item) {
        console.log(item);
    }

这会导致“项目描述”，而不是 {'id': 4, ....我该如何更改它？

Answer 1

<select [(ngModel)]="selectedValue" (change)="doSomething()">
    <option disabled selected>Please select...</option>
    <option *ngFor="let item of items" [ngValue]="item">{{ item.description }}</option>
    <option [ngValue]="">None of the above</option>
</select>

selectedValue: any;
doSomething() {
    console.log(this.selectedValue);
}

你可以试试这个想法。