Angular 2在加载时禁用/启用反应式表单元素
发布时间:2020-12-17 17:28:16 所属栏目:安全 来源:网络整理
导读:我有一个动态的反应形式组件.你传递一组字段,然后构建一个表单. 当我有一个checkbox元素控制是否启用或禁用同一表单中的另一个元素时,我的问题就来了.更改控制复选框时更新兄弟元素没有问题,但是当加载视图时,我得到了旧的ExpressionChangedAfterItHasBeenCh
我有一个动态的反应形式组件.你传递一组字段,然后构建一个表单.
当我有一个checkbox元素控制是否启用或禁用同一表单中的另一个元素时,我的问题就来了.更改控制复选框时更新兄弟元素没有问题,但是当加载视图时,我得到了旧的ExpressionChangedAfterItHasBeenCheckedError错误(显然只在dev中) public ngOnInit() { // If the element is a field controller subscribe to it's value changes if (this.elementVal.isFieldController === true) { // This is what's causing the issue this.toggleControlledFields(this.form.get(this.elementVal.key).value); this.form.get(this.elementVal.key).valueChanges .subscribe((data) => { console.log(data,'the data'); this.toggleControlledFields(data); }); } } fieldController可以控制一个或多个值,因此我遍历每个值并禁用或启用它控制的字段: – public toggleControlledFields(value) { if (value === '' || value === false) { this.elementVal.fieldsToControl.forEach((field) => { this.form.get(field).disable(); }); } else { this.elementVal.fieldsToControl.forEach((field) => { this.form.get(field).enable(); }); } } 因为我这样做onInit我得到了错误,我已经尝试添加了一个detectChanges()并且我尝试了不同的生命周期钩子,但是对于我的生活无法解决问题.任何帮助将不胜感激. 解决方法
所以我添加了下面的生命周期钩子,检测变化,这似乎解决了我的问题,也许这将有助于其他人..
constructor(private cd: ChangeDetectorRef) {} public ngAfterViewInit() { this.cd.detectChanges(); } (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |