沒有 ngmodel 的 angular 中的復選框？ 用什么代替？

Question

我有一個需要增強的復選框，之前它處理了對后端的調用，但現在不再需要它，並且只需要一個復選框，如果選中則關閉其他復選框：

    <label class="custom-control custom-checkbox" style="display: block">
      <input type="checkbox" class="custom-control-input" id="myCheckbox" name="myCheckbox"
             [(ngModel)]="checkboxPolicy" (ngModelChange)="parentcheckbox($event,child1,child2,child3)">
      <span class="custom-control-indicator"></span>
      <span class="custom-control-description">
        <span id="checkboxstart">
        </span>
      </span>
    </label>

我需要完全刪除 ngModel，但輸入需要它，是否可以擁有一個純粹用於 UI 目的的無數據復選框。 不控制任何數據，只控制 ngModelChange 方法中的其他框。

Answer 1

您可以在代碼中刪除 [(ngModel)] 並將 (ngModelChange) 替換為 (change) ，它會起作用。 無論 checkboxPolicy 實現了什么，都可以通過 parentcheckBox function 中的 $event 來處理。 下面的代碼應按要求工作。

<label class="custom-control custom-checkbox" style="display: block">
      <input type="checkbox" class="custom-control-input" id="myCheckbox" name="myCheckbox"
              (change)="parentcheckbox($event,child1,child2,child3)">
      <span class="custom-control-indicator"></span>
      <span class="custom-control-description">
        <span id="checkboxstart">
        </span>
      </span>
    </label>

---

  parentcheckbox(val, x, y, z) {
    const isChecked = val.currentTarget.checked;
    if (isChecked) {
      // disable the checkboxes
    } else {
      // enable the checkboxes
    }
  }