mardi 16 juillet 2019

Angular 8 - *ngIf and mat-checkbox not working

I'm having an issue with the Angular Material Checkbox which I thought would be a relatively simple thing, but for some reason I can't get it to work.

I have a div which I only want to show when the mat-checkbox is checked, but it doesn't seem to want to work with *ngIf even though I found an example of it working here: https://stackblitz.com/edit/angular-mat-checked?file=app%2Fcheckbox-overview-example.html

I tried applying very similar code to my project, but it doesn't seem to want to work, nor does anything else I've tried.

        <mat-checkbox [(ngModel)]="checked" [checked]="false">
          I agree to  storing my details.
          <a href="#" target="_blank">View full terms & conditions</a>
        </mat-checkbox>

        <div *ngIf="checked" id="contactOptionsGroup">
          <p>Stay updated with news, features, and offers related to .</p>
          <mat-checkbox>Phone</mat-checkbox>
          <mat-checkbox>Email</mat-checkbox>
        </div>

It seems like being able to show and hide this div by checking and unchecking should be relatively simple but I appear to be stumped. I might be missing something completely obvious, but I can't see what it may be.

There will be another instance of this functionality later on in the project too, so they'll need to work independently of each other.

If anyone has help or suggestions, I'd be eternally grateful.




Aucun commentaire:

Enregistrer un commentaire