2016-04-09 17 views
-2

Ben ngControl ile benim formda radyo düğmelerini nasıl uygulayabileceğiniz hakkında bir sorum varngControl (AngularJS2) ile radyo düğmeleri nasıl uygulanır?

İşte

şablonun kod şudur: Burada

<div class="form-group"> 
    <label class="radio-inline" *ngFor="#size of formModel.sizes"> 
     <input type="radio" ngControl="ourSize" #ourSize="ngForm" value="{{ size }}" > 
     {{ size }} 
    </label> 
</div> 

modelinin kod edilir:

this.formModel = { 
     sizes: ['asd1', 'asd2', 'asd3'] 
} 

Böyle bir halim var: enter image description here

PS Zaten başka bir yanıt Angular2 - Radio Button Binding kontrol ettikten ama sen radyo girişleri bu şekilde kullanmak gerekir

+0

sorunu yeniden bağlantılı sorunun cevabı sağlayan bir Plunker oluşturun örnek içerdiğini sen şablon olarak kullanabilir. –

+0

@ GünterZöchbauer, http://plnkr.co/edit/oh4McekaRWSH0XpGv01I?p=preview – weratius

+0

Neden

cevap

3

(bana yardım etmedi. Radyo düğmesi durumları ne seçilmiş olduğunu göre güncellenir

@Component({ 
    selector: 'my-app', 
    template: ` 
    <form> 
     <div class="form-group"> 
     <label class="radio-inline" *ngFor="#size of formModel.sizes; #i=index"> 
     <input type="radio" [(ngModel)]="formModel.sizes[i]" #ctrl="ngForm" ngControl="sizeCtrl" name="size"/> 
     {{ size.value }} 
     </label> 
    </div> 
    Test: {{ctrl?.value}} 
    Values: {{formModel | json}} 
    </form> 
` 
}) 
export class AppComponent { 
    constructor() { 
    this.formModel = { 
     sizes: [ 
     new RadioButtonState(true, 'asd1'), 
     new RadioButtonState(false, 'asd2'), 
     new RadioButtonState(false, 'asd3') 
     ] 
    }; 
    } 
} 

O kokan . t

Se Bu plunkr ... denetimleri bu seviyede kullanılabileceğini görünüyor: https://plnkr.co/edit/kHJyq3N5ZtoNyAPz6Kbc?p=preview

İlgili konular