Question

我正在尝试在检查其他状态时更改复选框检查状态。它在我的视图中正常工作，但我可以在chrome检查工具中看到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;
}

操纵角度分量中的复选框prop

1 个答案: