Two mat-slide-toggle with reactiveForms

0
votes

In reactive form I have two mat-slide-toggle (binded with one variable). But they don`t toggle together. Wenn I use [(ngModel)] everything is working. Unfortunately this solution does not suit me because mat-slide-toggle is a part of big form.

https://stackblitz.com/edit/angular-mvpfu5-xptpb7?file=app%2Fslide-toggle-overview-example.html

1
angularangular-materialangular-reactive-forms

1 Answers

2
votes

Try this:

 <div id="pdf-content">
      <mat-slide-toggle [(ngModel)]="ifPrint"></mat-slide-toggle> {{ifPrint}}


    <mat-slide-toggle [(ngModel)]="ifPrint"></mat-slide-toggle> {{ifPrint}}
    <ul [formGroup]="form">
      <li>
                  <mat-slide-toggle [checked]="form.value.activ" formControlName="activ"  color="primary" name="active" id="active">Activ</mat-slide-toggle> 
      </li>
      <li>
              <mat-slide-toggle [checked]="form.value.activ" formControlName="activ" color="primary" name="active" id="active">Activ</mat-slide-toggle> 
      </li>
    </ul>
    {{ form?.value | json }}