如何为Angular反应形式动态设置禁用?

时间:2017-05-31 16:10:30

标签: angular kendo-ui-angular2 angular-reactive-forms

我有一个使用Kendo Angular Grid控件的Angular 4.10应用程序。我正在使用外部编辑。我已经创建了FormGroup,如下所示:

        this.editForm = new FormGroup({
        'Id': new FormControl({ value: 0, disabled: true }),
        'Name': new FormControl("", Validators.compose([Validators.required, Validators.maxLength(30)])),
        'BlindName': new FormControl({ value: "" }, Validators.compose([Validators.required, Validators.maxLength(30)])),
        'UnitText': new FormControl(0),
        'IsFromBsp': new FormControl(true),
        'Disabled': new FormControl(false),
        'SortOrder': new FormControl(0, Validators.compose([Validators.required, Validators.pattern('\\d')]))
    });

我想要做的是根据值IsFromBsp为BlindName字段设置禁用状态。类似的东西:

'BlindName': new FormControl({ value: "", disabled: this.IsFromBsp }, Validators.compose([Validators.required, Validators.maxLength(30)])),

有没有办法实现这个目标?请告诉我。 感谢

2 个答案:

答案 0 :(得分:6)

如果CREATE TABLE IF NOT EXISTS `follow`( `id` INT NOT NULL PRIMARY KEY AUTO_INCREMENT, `user_id` BIGINT, `follower_id` BIGINT, `status` ENUM ('follow','blocked') NOT NULL, FOREIGN KEY (user_id) REFERENCES `user`(id), FOREIGN KEY (follower_id) REFERENCES `user`(id) ) ENGINE=InnoDB DEFAULT CHARSET=utf8; IsFromBsp,我假设您要禁用输入字段。如果最初只需要这样做,您可以在构建表单后运行一个函数:

true

如果此值发生更改,则必须在某个更改事件上再次调用此函数,或者使用check() { if(this.editForm.get('IsFromBsp').value == true) { this.editForm.get('BlindName').disable() } } ,或者使用(change)来监视表单值的更改,如果值是某些值,则除valueChanges以外,您可以true再次启用它。这适用于“常规”反应形式,希望也与剑道一起使用。

答案 1 :(得分:0)

我不知道这个剑道是如何工作的,但是在html中你可以做这样的事情:

 <input type="text" [disabled]="form.controls['IsFromBsp']==='' && form.controls['IsFromBsp'].touched" formControlName="something">