如何使用Angular5在反应式formGroup中禁用formArray的表单元素

时间:2018-04-04 04:28:56

标签: angular angular5 angular-reactive-forms

我在formArray中有两个下拉列表。

<select formControlName="access" (change)="checkValue($event)" >
  <option[value]="1">Admin</option>
  <option[value]="2">Customer</option>
</select>

<mat-select  formControlName="regions" multiple>
  <mat-option *ngFor="let region of regionArray" [value]="region.regionId">{{region.description}}</mat-option>
</mat-select>

如果所选的访问权限为“管理员”,则禁用区域选择。

checkValue(event) {  
    if (event.currentTarget.value === "1") {
        return this.myForm = this.fb.group({
                user: this.fb.array([this.disableDetail(),   ])
            }); 
    } else {  
        return this.myForm = this.fb.group({
                user: this.fb.array([this.enableDetail(),    ])
            }); 
    } 
}

enableDetail() {    
    return this.fb.group({
        regions: [{value:'',Validators: Validators.required, disabled:false}]     });   
    }

disableDetail() {
    return this.fb.group({
        regions: [{value:'', disabled:true}]    });  
}

我面临的问题是它正在影响其他表单数组。  我想如果我选择的下拉值为Admin它应该禁用并选择仅针对该特定formarray的区域下拉列表的所有值。

1 个答案:

答案 0 :(得分:0)

<强> HTML

isAdmin: boolean;
checkValue(event) {  
    this.isAdmin = event.currentTarget.value === "1";
}

<强>组件

uwsgi