在FormControl中将disabled属性设置为true肯定会禁用输入字段。

this.form=this.fb.group({
  FirstName:[{value:'first name', disabled:true}],
  LastValue:['last name,[Validators.required]]
})

上面的例子将禁用FirstName输入字段。

但是当您试图通过这样的表单访问禁用的字段值时，真正的问题就出现了 console.log (this.form.value.FirstName);它显示为undefined而不是打印field的实际值。因此，要访问禁用字段的值，必须使用响应式表单提供的getRawValue()方法。即console.log (this.form.getRawValue () .FirstName);将打印表单字段的实际值，而不是未定义。

name: [{value: '', disabled: true}, Validators.required],
name: [{value: '', disabled: this.isDisabled}, Validators.required],

or

this.form.controls['name'].disable();

一个更普遍的方法是。

// Variable/Flag declare
public formDisabled = false;

// Form init
this.form = new FormGroup({
  name: new FormControl({value: '', disabled: this.formDisabled}, 
    Validators.required),
 });

// Enable/disable form control
public toggleFormState() {
    this.formDisabled = !this.formDisabled;
    const state = this.formDisabled ? 'disable' : 'enable';

    Object.keys(this.form.controls).forEach((controlName) => {
        this.form.controls[controlName][state](); // disables/enables each form control based on 'this.formDisabled'
    });
}

不能在响应式表单中使用disabled属性禁用输入控件。 最好的解决方案是添加一个fieldset元素，并在fieldset元素中插入输入控件。 在此之后，您可以使用typescript轻松禁用或启用fieldset元素。

前女友。

index . html

<fieldset [disabled]="variable_name">
    <input name="name" formcontrolname="name">
</fieldset

index.ts

 variable_name:boolean;

 if(condition):
 {
     variable_name=true;
 }
 else
  {
     variable_name=false;
  }

这将很容易帮助您动态地隐藏或显示输入控件

我有同样的问题，但调用this.form.controls['name'].disable()没有修复它，因为我正在重新加载我的视图(使用router.navigate())。

在我的情况下，我必须重置我的表单之前重新加载:

这一点。Form = undefined; this.router.navigate((路径));

在响应式表单的DOM中使用disable是不好的做法。 当初始化from时，你可以在FormControl中设置这个选项

username: new FormControl(
  {
    value: this.modelUser.Email,
    disabled: true
  },
  [
    Validators.required,
    Validators.minLength(3),
    Validators.maxLength(99)
  ]
);

不需要属性值

或者你可以使用get('control_name')来获取表单控件并设置为禁用

this.userForm.get('username').disable();