如何在 Angular 8 中的选择标签上设置占位符？

Question

我正在创建一个下拉列表来过滤数据，所以我创建了一个下拉列表

<form  #filter="ngForm" (ngSubmit)="filterta(filter)" style="display: flex;">
       <select  ngModel #month="ngModel" name="month" required  >
                <option [ngValue]="null" [disabled]="true" >All</option>
                <option value="1">January</option>
       </select>
</form>

当我从ngModel #month="ngModel" 选择标签中删除这些属性时，它会显示占位符选项 All，当我添加这些属性时，它会在占位符中显示空白。

Answer 1

这在 Angular-10 中对我有用。

<select class="form-control" name="role" id="role" formControlName="role">
     <option value="" disabled selected>Select the role</option>
     <option *ngFor="let role of roleList" value="{{ role }}">{{role}}</option>
</select>

Answer 2

设置的初始值month = null中component.ts，添加[(ngModel)]="month"在select的标签component.html。

组件.ts

month = null;

组件.html

<form  #filter="ngForm" (ngSubmit)="filterta(filter)" style="display: flex;">
       <select name="month" [(ngModel)]="month" #month required>
                <option [ngValue]="null" [disabled]="true" >All</option>
                <option value="1">January</option>
       </select>
</form>