MatRadioGroupComp wanr 在控制台中

Question

我的 Angular 项目中有这段 HTML：

                            <th2-mat-radio-group
                                [radioButtonList]="isOneWayRadioButtons"
                                [form]="typeSettingForm"
                                formControlFieldName="isOneWay"
                                [required]="false"
                                name="isOneWay"
                                >
                            </th2-mat-radio-group>

但是即使我在这里没有使用禁用属性，我仍然在控制台中收到此警告。如果我删除 [form] 部分，警告就会消失，但表单会停止工作。

Th2MatRadioGroupComponent.ngfactory.js:212 
      It looks like you're using the disabled attribute with a reactive form directive. If you set disabled to true
      when you set up this control in your component class, the disabled attribute will actually be set in the DOM for
      you. We recommend using this approach to avoid 'changed after checked' errors.
       
      Example: 
      form = new FormGroup({
        first: new FormControl({value: 'Nancy', disabled: true}, Validators.required),
        last: new FormControl('Drew', Validators.required)
      });

我的settings-form.ts中有这个：

            isOneWay: new FormControl({ value: false, disabled: true }, []),

如何删除此警告并保持按钮功能？非常感谢。

我想从控制台删除 de warn 但保持表单正常工作。

Answer 1

在

th2-mat-radio-group

的 HTML 中删除您添加的

[disabled]

属性。相反，以编程方式设置禁用标志，或使用以下指令，

import { Directive, Input } from '@angular/core'
import { NgControl } from '@angular/forms'

@Directive({
  selector: '([formControlName], [formControl])[disabledControl]',
})
export class DisabledControlDirective {
  @Input() set disabledControl(state: boolean) {
    const action = state ? 'disable' : 'enable'
    this.ngControl.control[action]()
  }

  constructor(private readonly ngControl: NgControl) {}
}

文章 - 使用自定义指令禁用反应式表单控件