在 Angular 6 中设置下拉菜单的默认值 [英] Set default value of dropdown in Angular 6
问题描述
我正在使用服务填充 DropDown.服务返回简单的键/值对数组.
打字稿:
public initializeForm(): void {this.form = this.fb.group({供应商Id: ["", [Validators.required]],用户名:["", Validators.required],凭据:["", [Validators.required]],评分: [""]})}this.adminService.getSuppliers({ active: "true" }).subscribe(res => {this.suppliers = res;})HTML:
<块引用>
如下图所示，默认选项未设置为选中状态页面加载选项.我希望在页面加载时选择默认选项，就像简单的 HTML 一样，并在我尝试通过在下拉列表中选择默认选项来提交页面时触发所需的字段验证
更新:
如果我将默认选项值设置为 0，则它不支持必需的验证，如果我选择默认选项，则认为它有效
将validation.min 设置为required 以及如下所示.
supplierId: ["", [Validators.required, Validators.min(1)]]<块引用>
supplierId 始终大于零，因此 min(1) 适合您.
I am populating DropDown using service. service returns simple Array of key/value pair.
TypeScript:
public initializeForm(): void {
this.form = this.fb.group({
supplierId: ["", [Validators.required]],
username: ["", Validators.required],
credentials: ["", [Validators.required]],
rating: [""]
})
}
this.adminService.getSuppliers({ active: "true" }).subscribe(res => {
this.suppliers = res;
})
HTML:
<select class="form-control" formControlName="supplierId">
<option>Select Supplier</option>
<option *ngFor="let s of suppliers" [value]="s.supplierId">{{s.supplierName}}</option>
</select>
As you can see in below image, default option is not set as selected option on page load. I want default option to be selected on page load same like simple HTML and fires required field validation when I try to submit page by selecting default option in dropdown
UPDATED:
If i set default option value to 0, it doesn't support required validation and consider as valid if I select default option
Set validation.min with required as well like below one.
supplierId: ["", [Validators.required, Validators.min(1)]]
supplierId is always greater zero so min(1) works for you.
这篇关于在 Angular 6 中设置下拉菜单的默认值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
