* ngFor [Angular2]

Question

는 I 객체 어레이의 길이에 기초하여 라디오 버튼 동적 번호 필요 (예 : enum_details)

:

다음 I 시도한 코드

<div *ngFor="let enum of enum_details"> 
    <label for="enum_answer_{{enum.value}}"> 
    <input id="enum_answer_{{enum.value}}" type="radio" name="enums" [(ngModel)]="enum.value"> 
    {{enum.display_text}} 
    </label> 
</div> 

그러나 라디오를 클릭하면 항상 마지막 하나가 선택되고 값은 ngModel으로 지정되지 않습니다.

ngModel을 제거하면 라디오는 정상적으로 작동하지만 값은 설정되지 않습니다. 여기서 해결할 수있는 것은 무엇입니까?

Answer 1

이

<div *ngFor="let enum of enum_details"> 
     <label for="enum_answer_{{enum.name}}"> 
     <input id="enum_answer_{{enum.name}}" [value]='enum.name' type="radio" name="enums" [(ngModel)]="radioSelected"> 
     {{enum.name}} 
     </label> 
    </div> 
    <button (click)='radioFun()'>Checked value of radio button</button> 

작업 예를

Working example here

과 같은 코드를 사용

Answer 2

다음과 같이 시도해보십시오.

<div class="radio" *ngFor="let key of enum_details"> 
      <label> 
       <input type="radio" name="keys_on_hand" [value]="key.value" [(ngModel)]="key.value"> 
        {{key.display}} 
      </label> 
    </div>