禁用表单控件上的切换

Disable toggle on form control

我已经初始化并禁用了一个表单。现在,单击按钮将启用表单。但问题是必须始终禁用表单控件之一。当我启用表单时,禁用的表单控件也被启用。

这是我所做的

onInit() {
  this.fruitForm = this.formBuilder.group({
    name: [this.fruit.name, [Validators.required]],
    supplier: [{ value: this.fruit.user, disabled: true }, [Validators.required]],
    quantity: [this.fruit.qty, [Validators.required]]
  });
  this.fruitForm.disable();
}

并启用表单

edit() {
if (button == 'Modify') {
  this.fruitForm.enable();
  button = 'Save'
} else {
  this.fruitForm.disable();
  button = 'Modify'
}
}

点击按钮两次以上后,表单始终处于启用状态,根本不会被禁用

您可以在启用所有表单后手动禁用表单控制

this.fruitForm.enable();
this.fruitForm.controls['supplier'].disable();