Угловой 2: как создать радиокнопки из перечисления и добавить двустороннюю привязку?

Question

Я пытаюсь использовать синтаксис Angular2 для создания радиокнопок из определения перечисления и привязывать значение к свойству, которое имеет тип этого перечисления.

Мой HTML содержит:

<div class="from_elem"> 
    <label>Motif</label><br> 
    <div *ngFor="let choice of motifChoices"> 
     <input type="radio" name="motif" [(ngModel)]="choice.value"/>{{choice.motif}}<br> 
    </div> 
</div> 

В моей @Component я объявил набор вариантов и значений:

private motifChoices: any[] = []; 

И в конструкторе моего @Component, я заполнила выбор в следующим образом:

constructor(private interService: InterventionService) 
{ 
    this.motifChoices = 
     Object.keys(MotifIntervention).filter(key => isNaN(Number(key))) 
      .map(key => { return { motif: key, value: false } }); 
} 

Радиокнопки отображаются правильно, теперь я пытаюсь привязать значение выбранный для свойства. Но когда я нажимаю одну из кнопок, значение value.value имеет значение undefined.

Answer 1

Хорошо, наконец, я нашел решение. Я использую Angular 2 RC5.

Значение перечисления Я хочу, чтобы связать мое радио является собственностью:

intervention.rapport.motifIntervention : MotifInterventions

В моей @Component я объявил частных пользователей, чтобы предоставить доступ к определению перечислений в шаблоне HTML:

export class InterventionDetails 
{ 
    private MotifIntervention = MotifIntervention; 
    private MotifInterventionValues = Object.values(MotifIntervention).filter(e => typeof(e) == "number"); 

    // model object: 
    private intervention: Intervention; 

Вот HTML код для радиокнопок:

<div *ngFor="let choice of MotifInterventionValues"> 
    <input type="radio" 
      [(ngModel)]="intervention.rapport.motifIntervention" 
      [checked]="intervention.rapport.motifIntervention==choice" 
      [value]="choice" /> 
    {{MotifIntervention[choice]}}<br> 
</div> 

• [(ngModel)]="intervention.rapport.motifIntervention" двухсторонняя связывания, требуется обновить свойство в модели (в моем случае intervention.rapport.motifIntervention)

• [checked]="intervention.rapport.motifIntervention==choice" является необходимо обновить кнопки радио компонент, если значение вмешательства. rapport.motifIntervention модифицируется извне.

• [value]="choice" - это значение, присвоенное моей собственности при выборе переключателя.

• {{MotifIntervention[choice]}} является меткой радио-кнопки