mercredi 15 janvier 2020

Repeat set of checkboxes and prevent checking the same one multiple times

I have an issue with the following in Angular/Typescript.

I have a set of checkboxes and I need to display it on multiple places on my page.

Suppose I have the following:

box-1 box-2 box-3 box-4 box-5 box-6

box-1 box-2 box-3 box-4 box-5 box-6

box-1 box-2 box-3 box-4 box-5 box-6

box-1 box-2 box-3 box-4 box-5 box-6

So I have 4 times a set of 6 checkboxes with repeated elements. I should only be able to select each element once. So if I check box-1 on the first row it should be unchecked on all others. If then I check box-1 on the third row it should be unchecked everywhere but the third.

I managed to do it for two sets but can't make it work for more?

Any idea on how to do this?

<div class="checkbox-container">
    <mat-checkbox *ngFor="let child of children">
        
    </mat-checkbox>
</div>`

Now somewhere else I have the same ngFor with the same checkboxes but if I shouldn't be able to check the same child in two checkboxes

I bind the boolean with ngModel or checked but then I have to check all other ones?




Aucun commentaire:

Enregistrer un commentaire