如果其他控件沒有值，如何使復選框保持禁用狀態，如果控件在 angular8 中有值則啟用

Question

我有一個復選框字段，如果另一個控件有值，我想在其中啟用復選框。 在這里，我有 2 個控件amount and update received 。 如果 update Received 控件中有值，則必須允許用戶在金額字段中進行簽入/簽出。 如果更新請求控件為空/null，則金額復選框必須保持禁用狀態，並且不應允許用戶簽入/簽出。

演示： 演示

TS：

initEoForm() {
    this.eoInfoForm = this.FB.group({
      amount: ['', Validators.required],
      updateRequested:['']
    });
  }  


  public disableUpdate() {
    let disabled = true;
      if (this.eoInfoForm.value.updateRequested) {
        disabled = false;
        return false;
      }
    return disabled;
  }

HTML：

<form  [formGroup]="eoInfoForm">
  <div class="row">
    <div class="col">
       <div class="custom-control custom-switch">
         {{disableUpdate()}}
                <input type="checkbox" class="custom-control-input" id="noNewBusiness"
                    formControlName="amount"  disabled="disableUpdate()">
                <label class="custom-control-label" for="noNewBusiness">Update Received</label>
            </div>
    </div>
  </div>
</form>

為了查看我在 html 中得到真值還是假值，我嘗試檢查值{{disableUpdate()}} 。 它相應地給出真值或假值，但即使我得到真我也無法簽入/簽出。

Answer 1

我稍微調整了一下，但我做到了。 你需要 setAttribute() 和 removeAttribute()。 我喜歡避免 if 塊，我更喜歡三元運算符。

typing(event){
    let checkBox = document.getElementById('noNewBusiness')
    event.target.value == '' ? checkBox.setAttribute('disabled', 'true') : checkBox.removeAttribute('disabled')
  }

堆棧閃電戰