Comment obtenir les valeurs de checkbox dans ngFor? En angulaire 2+?

Question

Hy, j'ai besoin de collecter les valeurs sélectionnées par checkbox check qui sont dans ngFor. Voici le code.

<tr *ngFor="let item of items; let index = index;"> 
    <td>{{item.bed}}</td> 
    <td>{{item.size}}</td> 
    <td>{{item.name}}</td> 
    <td> 
     <input type="checkbox" 
      name="domain-{{item.bed}}" 
      [(ngModel)]="items[index].id" 
     > 
    </td> 
    </tr> 
<button (click)="OnSelect()">Select</button> 

Dans le composant, j'essaie d'accéder comme ceci. Sur sélection, je vois toutes les valeurs des éléments imprimés à la place des valeurs de case à cocher sélectionnées. Des pensées ?

Answer 1

<td> 
    <input type="checkbox" 
     name="item-{{item.bed}}" 
     #myItem 
     (change)="OnCheckboxSelect(item.id, $event)" 
    > 
</td> 

Dans le composant:

@ViewChildren('myItem') item; 
selectedIds = []; 

    OnCheckboxSelect(id, event) { 
    if (event.target.checked === true) { 
     this.selectedIds.push({id: id, checked: event.target.checked}); 
     console.log('Selected Ids ', this.selectedIds); 
    } 
    if (event.target.checked === false) { 
     this.selectedIds = this.selectedIds.filter((item) => item.id !== id); 
    } 
    } 

j'ai pu obtenir ce que je veux de cette façon.