2016-07-05 17 views
2

Mit den alten Formen ich das Optionsfeld wie folgt gesetzt werden könnte geprüft:Angular 2 RadioButton- Karo

<div class="radio" *ngFor="let transport of transports"> 
    <label> 
    <input type="radio" name="transport" [ngModel]="{checked: transport.id == selectedTransport.id}" (change)="onTransportChange(transport)"> {{ transport.name }} 
    </label> 
</div> 

Mit den neuen Winkelformen könnte ich dies nicht mit [ngModel]="{checked:''}" erreichen, aber ich [checked] verwenden, kann ich dann zu tun versucht:

<input type="radio" name="transport" [checked]="transport.id == selectedTransport.id"> {{ transport.name }} 

Und das funktioniert, aber wenn ich [ngModel] setzen Sie diese überprüfen nicht mehr:

<input type="radio" name="transport" [checked]="transport.id == selectedTransport.id" [ngModel]="transport" (change)="onTransportChange(transport)"> {{ transport.name }} 

Edit:

Plunker mit alten Formen: http://plnkr.co/edit/zu4j9MpALIgCT9JHuIPz?p=preview

Plunker mit neuen Formen: http://plnkr.co/edit/cWCp5d122h3wvSRa8AYQ?p=preview

Wer mir dabei helfen? Vielen Dank!

+0

Welchen Wert hat Ihr ng-Modell? Sein Wert könnte dazu führen, dass der Radiobutton wieder deaktiviert wird ... –

+0

@ Mr.Noddy danke für die Antwort, ich habe meine Frage bearbeitet, einen Plunder mit alten und neuen Formularen hinzugefügt ... –

+0

Haben Sie in der Zwischenzeit eine Lösung gefunden? – Greg

Antwort

1

Versuchen Sie, Attributwerte anzugeben. Und vergessen Sie nicht, dass Modell im Falle von Optionsfeldern soll nicht boolean Wert enthalten sollte aber Radio spezifische Werte wie enthalten:

<input type="radio" name="food" value="beef" [(ngModel)]="myFood"> Beef 
    <input type="radio" name="food" value="lamb" [(ngModel)]="myFood"> Lamb 
    <input type="radio" name="food" value="fish" [(ngModel)]="myFood"> Fish 

In diesem Fall brauchen Sie nicht [geprüft] Attribut.