title: How to use angular model change and double binding simultaneously
body: <p>I have some trouble with the angular binding model: </p>
  
  <p>I have two lists (classes and students). On the student-detail page, I want to: </p>
  
  <ol>
  <li>Present all the classes available; </li>
  <li>Toggle to "true" the classes that the student already takes. </li>
  <li>Allow the user to add/remove classes.</li>
  </ol>
  
  <p>I have no problem to do either 2 or 3 - but I can't do both. </p>
  
  <pre><code>&lt;ion-list *ngFor="let cls of listOfAllClasses"&gt;
    &lt;ion-label&gt;{{cls.name}}&lt;/ion-label&gt;
      &lt;ion-toggle [(ngModel)]="cls.checked (ngModelChange)="pushClsToStudent(cls)"&gt;
    &lt;/ion-toggle&gt;
  &lt;/ion-list&gt;
  </code></pre>
  
  <p>The Javascript:</p>
  
  <pre><code>pushClsToStudent(cls) {
     cls.checked? this.student.classes.push(cls) : this.student.classes.filter(c =&gt; c.classId !== cls.classId)
  </code></pre>
  
  <p>The problem is that it makes angular fire two events (1. (ngModel) 2. (ngModelChane). But I don't know how can I bypass it.</p>
  
  <p>Thank you so much in advance!</p>