如何在Angular表单字段的选择选项中显示默认值

Question

我在Angular 6应用程序中有一个选择表单字段，选项来自一个数组。但default value没有显示或selected state？到目前为止，我的代码如下：

<select formControlName="category" class="form-select">
    <option *ngFor="let state of category" [value]="state.category">
        {{ state.category }}
    </option>
</select>

ts.file

category = [
    { category: 'Nothing'},
    { category: 'Additional'},
    { category: 'Changing'},
  ];


ngOnInit() {
this.serviceForm = new FormGroup({
  category: new FormControl(this.category[0]),
});

}

Answer 1

为选择的ngModel设置默认值，如：

class AppComponent {
  defaultCateg:string="Additional";
}

HTML：

<select [ngModel]="defaultCateg">

Here is an examle

Answer 2

你可以这样做：

<select(change)="ChangingValue($event)" [value]='55'>
<option value='50'>50/option>
<option value='55'>55</option>
<option value='60'>60</option>
<option value='70'>70</option>
</select>