天天看點

HTML5 實作angular2可編輯的下拉框

HTML5中新增了

<datalist>

标簽,它可以為

<input>

指定預定義選項清單,在使用時

<input>

元素的 list 屬性必須引用

<datalist>

元素的 id 屬性才能生效。

<datalist>

是HTML5的屬性,是以隻能在支援H5的浏覽器中使用。

使用者在他們輸入資料時會看到預定義選項的下拉清單,由于

<datalist>

自帶搜尋功能,是以使用時想看到所有下拉選項必須清空

<input>

中的内容。

<div>
    <input [(ngModel)]="num" list="numbers"/>
    <datalist id="numbers">
       <option *ngFor="let item of nums" [value]="item">
    </datalist>
</div>
           

TS

private nums:number[];
private num:number;
ngOnInit() {
    this.nums=[,,,,,]
    this.num=;
}
           

繼續閱讀