[英]Angular 7 mat-checkbox not being checked with reactive forms
我正在使用Angular7 mat-checkbox和反应形式。 下面是代码。
shared: FormGroup;
constructor(private router: Router, fb: FormBuilder,private filterServices:FilterServices) {
this.shared = fb.group({
"byAll": false,
"byFriends": false,
"byPeers": false,
"byExperts": false,
"bySpecificFriends": false,
"byNone":false,
"permissionType":"share",
"emails": []
});
}
在nginit函数上,我从db获取数据,如下所示
ngOnInit(){
this.filterServices.getFilters(12).subscribe((res)=>{
console.log(res);
this.setFormvalues(res);
})
}
setFormvalues(response:any){
response.forEach(element => {
this.sharedEmails = [];
this.sharedEmails = element['emails'].split(',');
this.shared.value['byAll'] = element["byAll"]
this.shared.value['byExperts'] = element['byExperts']
this.shared.value['byFriends'] = element['byFriends']
this.shared.value['byNone'] = element['byNone']
this.shared.value['byPeers'] = element['byPeers']
this.shared.value['bySpecificFriends'] = element['bySpecificFriends']
console.log(this.shared)
})
}
我能够将数据设置为共享对象中的属性,但是未检查html中的复选框。 假设共享['byAll']最初为false(最初未选中复选框),但在从服务调用获取数据后,其值为true。 但是在html中没有得到反映,我的意思是复选框没有得到检查。 我在哪里错了?
下面是html代码。
<form [formGroup]="shared">
<div fxLayout="row" fxLayoutGap="20px">
<mat-checkbox formControlName="byAll">All</mat-checkbox>
</div>
</form>
尝试这个
this.shared.value['byAll'].setValue(element["byAll"]);
我得到了解决方案!
如果我们只更新几个值,我们可以使用patchValue,否则如果我们想更新表单组中的所有值,则使用setValue。
补丁值格式
this.shared.patchValue({
"key":"value"
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.