Angular 6 - 无法禁用输入文本框

Question

我想在选中复选框时禁用我的文本框。问题是，我什至一开始就无法无条件地禁用它。

这是我的 HTML:

<label for="checkbox-inline">
    <input type="checkbox" class="checkbox other" name="others" value="15"
        #goodsOthersChk (change)="onCheckArray($event, Form.value.goods)">
    <p class="otherText"> Others:</p>
    <input id="goodsOthers" name="goodsOthers"
        formControlName="goodsOthers" type="text" value=""
        class="form-control otherInput" size="30%" [disabled]="isDisabled">
</label>

我的component.ts:

export class GoodsComponent implements OnInit {
  isDisabled = true;
}

我不明白我错过了什么。当我检查文本框时，它有一个属性 of ng-reflect-is-disabled 设置为 true 但没有反映在我的页面上。

Answer 1

我认为那是因为您使用的是 Reactive Forms。从理论上讲，您可以使用 disabled 属性，但是 Reactive Form 的处理方式是在初始化 FormGroup 时设置 disabled 属性。

yourFrom: FormGroup = this.formBuilder.group({
  goodsOthers: [{ value: null, disabled: true }],
  .
  .
  // other Form controls
})

Other FormControl properties

Angular 6 - 无法禁用输入文本框

Angular 6 - unable to disable input textbox

angular

angular-forms