Как вызывать разные методы, когда флажок установлен / снят в Angular?

Question

В моем классе компонентов у меня есть два метода, один для того, когда флажок установлен, и один для того, когда флажок не установлен. Как мне определить это поведение в моем файле шаблона? это своего рода псевдокод того, для чего я ожидал иметь функциональность, хотя по прошествии некоторого времени, просматривая веб-страницы, я не вижу никакой подобной опции и, похоже, не понимаю, как это сделать

<input type="checkbox" *when checked*="method1()" *when unchecked*="method2()">

как мне это реализовать?

Answer 1

Вы можете добиться этого, как показано ниже:

в component.html:

<input type="checkbox" [(ngModel)]="isChecked" (change)="handleChange()" />

в component.ts:

handleChange() {
    console.log(this.isChecked);
    if (this.isChecked) {
      this.checkedTrue();
    } else {
      this.checkedFalse();
    }

  }

  checkedTrue() {
    console.log('checked')
  }

  checkedFalse() {
    console.log('unchecked')
}

Вот рабочая демонстрация: демо