Question

我正在动态渲染复选框和组合框字段并执行以下功能：

根据API响应，如果复选框字段显示为已选中，则组合框显示为启用，否则将禁用。
如果用户选择复选框字段，则应启用组合框，否则禁用

组合框字段适用于第一种情况但不适用于第二种情况。状态（启用或禁用）以后不能更改。

这是我的模板代码段：

 < tr *ngFor="let widgetAttribute of _preferencesWidget">

 < td *ngFor="let subattribute of widgetAttribute.methods">

 < select *ngIf="subattribute.name == 'Email' && subattribute.type == 'LIST'" id="{{subattribute.name}}Check" class="selectpicker" data-max-options="1" (change)="validateCombo($event)"
                                                            [disabled]="!subattribute.enabled">
                                                                <option *ngFor="let subValue of subattribute.values" value="{{subValue.code}}" [selected]="subValue.code == subattribute.selected">{{subValue.description}}< /option>
                                                            < /select>
 < /td>
< /tr>

复选框的生成ID为： InformationCheck ，对于组合框： pensionMCheck

我的组件逻辑是：

 public validateCombo() {

     if (this.pensionCheck) {
         $('#pensionMCheck').prop('disabled', false);
         if ($('#pensionMCheck').val() === 'Y') {
             this.pensionMCheck = true;
         } else {
             this.pensionMCheck = false;
         }
    } else {
         this.pensionMCheck = false;
         $('#pensionMCheck').val('N');
         $('#pensionMCheck').prop('disabled', true);
         $('#pensionMCheck').prop('selectedIndex', 0);
    }

Answer 1

将复选框状态绑定到属性（isChecked）并将enabled的{{1}}绑定到同一属性：

<select>

使用Angular2启用/禁用复选框字段

1 个答案: