ng-select 禁用表单控件不能以反应形式工作答案

【问题标题】：ng-select disable form control not working in reactive form angularng-select 禁用表单控件不能以反应形式工作
【发布时间】：2020-10-30 15:52:19
【问题描述】：

我正在尝试为我的表单设置值并希望禁用该表单。

不知何故，如果我设置值以形成它，它工作正常，但一旦我编写禁用方法，我的 ng-select 值就会消失。

是否有人在使用值禁用 ng-select 时遇到同样的问题？

form = new FormGroup({
    code: new FormControl()
});

values = [{
        value: "0"
        label: "test1"
    },
    {
        value: "1"
        label: "test2"
    }
]
//I am setting values using setvalue and disbling after wards
this.form.controls['code'].setValue('0')
this.form.disable();

<ng-select formControlName="code" [items]="values" bindValue="value" labelForId="code"
[clearable]="false" [selectOnTab]="true" placeholder="Select one" data-e2e-id="code">
</ng-select>

【问题讨论】：

标签： javascript html angular angular-ngselect

【解决方案1】：

你确定你改变了值吗？

设置值方法：

使用 setValue() 的方法

this.form.get("code").setValue('0');
this.form.controls["code"].setValue('0');

使用 patchValue() 的方法

this.form.get("code").patchValue('0');
this.form.controls['code'].patchValue('0');
this.form.patchValue({"code": '0'});

在您的情况下，可能是仅在应用 disablibg 后才更新表单的问题，并且您没有看到您以错误的方式提交更新

【讨论】：

是的..抱歉编辑了我的问题..即使设置值后我仍然看到问题
你能复制它吗，因为我复制粘贴你的代码，它可以工作

【解决方案2】：

您可以在初始化时禁用/启用表单控件，方法是将disabled 设置为true，如下所示

users.push(this.fb.group({
  userType: this.fb.control({value: 'Admin', disabled: true})
}));

您可以通过调用该特定表单控件的禁用/启用方法来动态执行它。

// To enable form control
userType.enable();

// To disable form control
userType.disable();

【讨论】：