Question

我正在编写一个只读表单，显示在页面加载时检索的一组数据。表单上的一个部分是IsActive下拉列表，其值为True或False。在ngOnInit上，我从数据库中检索此IsActive布尔值，并将其与我的模型属性isActive绑定。我想显示此模型值及其匹配的下拉值。因此，例如，如果IsActive标志为true，我希望在页面加载时选择下拉列表中的true选项。

HTML：

<label class="col-md-2 col-form-label">Is Active</label>
    <div class="col-md-10">
        <select id="IsActive" name="IsActive" class="form-control" [(ngModel)]="selectedAccount.isActive" [disabled]="!isEditable">
            <option [value]="1">True</option>
            <option [value]="0">False</option>
        </select>
    </div>

但是，上面的代码在页面加载时有一个空白的选定选项，只有在单击时它才会显示true和false选项

Answer 1

你可以试试这个吗？

＆＃13;

option : any = [];
selectedAccount: any;
ngOnInit(){
this.selectedAccount.isActive = true;
this.option = [{"name": "true", value: true}, {name: "false", value: false}]
this.option.map(res =>{ if (res.value == this.selectedAccount.isActive){
  this.selected = res
}
});

}

＆＃13;

<div class="col-md-10">
        <select id="IsActive" name="IsActive" class="form-control" [(ngModel)]="selectedAccount.isActive" [disabled]="!isEditable">
        <option *ngFor="let option of selected" value={{option.value}}>{{option.name}}</option>
        </select>
    </div>

＆＃13;

角度5显示匹配选择列表选项与页面加载模型

1 个答案: