2017-03-23 6 views
0

In dem unten angegebenen Code kann ich eine beliebige Anzahl von Kontrollkästchen nach dem Zufallsprinzip aktivieren oder deaktivieren. Wie überprüft man, welche Eingabe checkBox-Tag mit Wert in Winkel 2 geändert hat?

<button class="button" type="button">Device 1</button> 
    &nbsp; <label class="switch"> 
    <input name="device1" type="checkbox" [(ngModel)]={{device1}} (ngModelChange)="OnInput($event)"> 
    <div class="slider round"></div> 
</label> 
<br/> <button class="button" type="button">Device 2</button> 
    &nbsp; <label class="switch"> 
    <input name="device2" type="checkbox" [(ngModel)]={{device2}} (ngModelChange)="OnInput($event)"> 
    <div class="slider round"></div> 
</label> 
    <br/> <button class="button" type="button">Device 3</button> 
    &nbsp; <label class="switch"> 
    <input name="device3" type="checkbox" [(ngModel)]={{device3}} (ngModelChange)="OnInput($event)" > 
    <div class="slider round"></div> 
</label> 
    <br/> <button class="button" type="button">Device 4</button> 
    &nbsp; <label class="switch"> 
    <input name="device4" type="checkbox" [(ngModel)]={{device4}} (ngModelChange)="OnInput($event)"> 
    <div class="slider round"></div> 
</label> 
    <br/> <button class="button" type="button">Device 5</button> 
    &nbsp; <label class="switch"> 
    <input name="device5" type="checkbox"[(ngModel)]={{device5}} (ngModelChange)="OnInput($event)"> 
    <div class="slider round"></div> 
</label> 
    <br/> <button class="button" type="button">Device 6</button> 
    &nbsp; <label class="switch"> 
    <input name="device6" type="checkbox"[(ngModel)]={{device6}} (ngModelChange)="OnInput($event)"> 
    <div class="slider round"></div> 
</label> 
    <br/> <button class="button" type="button">Device 7</button> 
    &nbsp; <label class="switch"> 
    <input name="device7" type="checkbox" [(ngModel)]={{device7}} (ngModelChange)="OnInput($event)"> 
    <div class="slider round"></div> 
</label> 
    </div> 
export class DashboardComponent{ 


    OnInput(value:any){ 
     console.log(value); 
    } 

Ich möchte wissen, welche Input-Tag wird ... mit dem Wert ausgewählt wird, und wollen nur erhalten geändert Kontrollkästchen Details mit Eingabename und Wert

Antwort

0

Verwenden ngModelChange

<input type="checkbox" [(ngModel)]="object.selected" (ngModelChange)="onChange(object.selected)"> 

Beim Aufruf von onChange setzen Sie den Zähler für den Wert

+0

können Sie eloborate ... wie man die Input-Tag geändert ... was Onchange Funktion sein sollte –

+0

die object.selected gibt Ihnen die Eingabe überprüft. Dann können Sie eine jquery-Funktion in der Komponente erstellen, die die von Ihnen benötigten Operationen ausführt – BhandariS

1

zurück. Sie können die angular2's namentlich übergeben Kennung/Referenz #the_name jeden Eingang und es in der Methode übergeben:

<input name="device1" type="checkbox" 
    #device1 
    [(ngModel)]={{device1}} 
    (ngModelChange)="OnInput($event, device1)"><!--pass it here--> 
Verwandte Themen