Question

角度绑定模型有些问题：

我有两个名单（班级和学生）。在学生详细信息页面上，我想：

介绍所有可用的课程;
切换到“true”学生已经学过的课程。
允许用户添加/删除类。

我做2或3都没有问题 - 但我不能同时做到这两点。

<ion-list *ngFor="let cls of listOfAllClasses">
  <ion-label>{{cls.name}}</ion-label>
    <ion-toggle [(ngModel)]="cls.checked (ngModelChange)="pushClsToStudent(cls)">
  </ion-toggle>
</ion-list>

Javascript：

pushClsToStudent(cls) {
   cls.checked? this.student.classes.push(cls) : this.student.classes.filter(c => c.classId !== cls.classId)

问题在于它会使两个事件发生角度点火（1.（ngModel）2。（ngModelChane）。但我不知道如何绕过它。

提前非常感谢你！

Answer 1

首先从()指令中删除NgModel：

<ion-toggle [ngModel]="cls.checked" (ngModelChange)="pushClsToStudent($event, cls)">

这样，ion-toggle的值将绑定到cls.checked的值，并且当您更改输入值时，pushClsToStudent(cls)将被触发。您需要在event函数中添加pushClsToStudent()参数，以便捕获并为cls.checked分配新值：

pushClsToStudent(event: any, cls: any) {
    this.cls.checked = event;
    ...
}

注意：

您发布的代码中缺少"，这会导致错误：

[(ngModel)]="cls.checked    ||    [(ngModel)]="cls.checked"

如何同时使用角度模型更改和双重绑定

1 个答案: