Comment puis-je mettre une valeur numérique dans la diapositive toogle Matériel angulaire

Question

Je voudrais obtenir tous « id » à partir d'éléments de la liste « checked »

<div *ngFor="let item of list"> 
    <md-slide-toggle [(ngModel)]="item.id"> 
     item.name 
    </md-slide-toggle> 
</div> 

Answer 1

Vous pouvez créer un tableau distinct qui gardent les pistes dont l'article dans la 'liste' a été marqué comme true. Ensuite, vous pouvez utiliser la sortie changeevent pour émettre des informations sur le item à votre composant et effectuer une action dessus.

code Exemple:

html:

<div *ngFor="let item of list; let i = index"> 
    <md-slide-toggle [checked]="flagArray[i]" 
        (change)="sendToServer($event, i, item)"> 
     {{item.name}} 
    </md-slide-toggle> 
</div> 

component.ts:

flagArray = []; 

    list = [ 
    { id: '1', name: 'item 1'}, 
    { id: '2', name: 'item 2'}, 
    { id: '3', name: 'item 3'}, 
    { id: '4', name: 'item 4'}, 
    ] 

    constructor(){ 
    for(let i=0; i<this.list.length; i++){ 
     this.flagArray.push(false); 
    } 
    } 

    sendToServer(event, index, item){ 
    this.flagArray[index] = event.checked; 

    if(event.checked == true){ 
     // add code to send item to server 
     alert("item to send to server: " + JSON.stringify(item));   
    } 
    else{ 
     // add code to remove item from server 
     alert("item to remove from server: " + JSON.stringify(item)); 
    } 
    } 

Plunker demo