This select
1路绑定工作
<select [(ngModel)]="selectedLocation">
<option *ngFor="let location of allLocationNames" [ngValue]="location">{{location.name}}</option>
</select>
selectedLocation
将始终包含选定的位置object.
This datalist
1-way绑定似乎不起作用
<h4>Guest: <input type="text" name="guest" [(ngModel)]="selectedGuest" list="options">
<datalist id=options *ngIf="allGuests">
<option *ngFor="let guest of allGuests" [ngValue]="guest">{{guest.companyName}}</option>
</datalist>
</h4>
selectedGuest
将不包含对象,而是包含所选元素的字符串值 (guest.companyName)。
如何获取数据列表示例中选定的对象?
我找到了解决这个问题的方法。您可以使用以下代码:
<input type="text" list="productList" name="product" [(ngModel)]='currentProduct' (change)="onProductChanged(currentProduct)" />
<datalist id="productList">
<select>
<option *ngFor="let product of products" [value]="product.name"></option>
</select>
</datalist>
我在打字稿中写道:
export class MySuperPrivateClass implements OnInit {
currentProduct: string = "";
selectedProduct: Product;
onProductChanged(productName) {
console.log(productName);
this.selectedProduct = this.getSelectedProductByName(productName);
}
getSelectedProductByName(selectedName: string): Product {
return this.products.find(product => product.name === selectedName);
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)