Манипулировать флажком опоры в угловом компоненте

Question

Я пытаюсь изменить состояние флажка при проверке другого.На мой взгляд, все работает хорошо, но в инструменте Chrome Inspection я вижу, что ng-reflect-model="true", когда этого не должно быть.Вот мой пример кода

component.html

<input type="checkbox" [checked]="isCustomer" (change)="isCustomerChange()" [(ngModel)]="user.isCustomer" [formControl]="registrationForm.controls['isCustomer']" id="isCustomerId" class="accountType" name="accountType">
  <label for="isCustomer" class="checkboxLabel">
    <span></span>
     Customer Account
  </label>
<input type="checkbox" [checked]="isStore" (change)="isStoreChange()" [(ngModel)]="user.isStore"[formControl]="registrationForm.controls['isStore']" id="isStoreId" class="accountType" name="accountType">
  <label for="isStore" class="checkboxLabel">
    <span></span>
    Store Account
  </label>

component.ts

export class RegisterComponent implements OnInit {
  isStore: boolean = false;
  isCustomer: boolean = false;

  isCustomerChange() {
    this.isCustomer = !this.isCustomer;
    this.user['isCustomer'] = this.isCustomer;
    this.isStore = false;
  }

  isStoreChange() {
    this.isStore = !this.isStore;
    this.user['isStore'] = this.isStore;
    this.isCustomer = false;
  }
}

Когда магазиннажал, я ожидаю, что клиент не будет проверен (ведет себя так на самом деле), и клиент проверял состояние, чтобы быть ложным (по-прежнему верно).Как я могу достичь этого результата?

Answer 1

Понял, мне нужно внести изменения в ngModel таким образом

isCustomerChange() {
  this.isCustomer = !this.isCustomer;
  this.user['isCustomer'] = this.isCustomer;
  this.user.isStore = false;
}

isStoreChange() {
  this.isStore = !this.isStore;
  this.user['isStore'] = this.isStore;
  this.user.isCustomer = false;
}