ng-repeat의 라디오 그룹이 예상대로 작동하지 않습니다.

Question

반복되는 각 항목에 대해 간단한 별표가 필요합니다. 그러나 예상대로 결과를 제공하지는 않습니다.

모든 항목의 별 등급이 변경되거나 첫 번째 행에 영향을줍니다.

-{{$index}}을 추가하기 위해 입력 유형의 name 속성을 변경했지만 여전히 작동하지 않습니다.

내 HTML

<div ng-repeat="item in $ctrl.serviceList | filter: $ctrl.form.searchKey" class="c-list"> 
     <md-card> 
      <div class="group full-width pad15">  
       <div><strong>Summary:</strong>{{item.problemSummary}}</div> 
       <div style=" word-wrap: break-word"> 
        <strong>Description:</strong> 

        <span>{{item.serviceDescription}}</span> 
       </div> 
       <div> 
        <strong>Docket Id: </strong> 
        <span>{{item.docketId}}</span> 
       </div> 
       <div><strong>Transaction Id: </strong>{{item.tid}}</div> 
       <div><strong>Created At: </strong>{{item.createdAt | date: 'medium'}}</div> 
       <div><strong>Created By: </strong>{{item.userName}}</div> 
       <div><strong>Status: </strong><span class="status-text-complete">{{item.status}}</span></div> 
       <div style="border-top: 1px solid #ccc;"> 
        <div class="stars"> 
         <form> 
          <input class="star star-5" id="star-5" type="radio" name="star-{{$index}}" value="1" ng-model="item.rating" /> 
          <label class="star star-5" for="star-5"></label> 
          <input value="2" class="star star-4" id="star-4" type="radio" name="star-{{$index}}" ng-model="item.rating"/> 
          <label class="star star-4" for="star-4"></label> 
          <input value="3" class="star star-3" id="star-3" type="radio" name="star-{{$index}}" ng-model="item.rating"/> 
          <label class="star star-3" for="star-3"></label> 
          <input value="4" class="star star-2" id="star-2" type="radio" name="star-{{$index}}" ng-model="item.rating"/> 
          <label class="star star-2" for="star-2"></label> 
          <input value="5" class="star star-1" id="star-1" type="radio" name="star-{{$index}}" ng-model="item.rating"/> 
          <label class="star star-1" for="star-1"></label> 
         </form> 
        </div> 
       </div> 
      </div> 
     </md-card> 
    </div> 

UPDATE

ctrl.serviceList = response.results; 


var response = {"results":[{"_id":"587f15ba2aaf761914c89498","createdAt":"2017-01-18T07:14:02.733Z","docketId":"MPA001218012017124402","mId":"5869efdd160812d78923ed9c","mobile":"9987464702","name":"new user","problemSummary":"Training Required","serviceComments":"asfsfsf","serviceDescription":"Training Required for this POS","serviceRating":3,"serviceSubType":"Re-training request","serviceType":"Training required","source":"MPA","status":"Complete","tid":"7895451455","userName":"dummy@nseit.com","__v":0},{"_id":"5880b48d85cce60d684abc98","createdAt":"2017-01-19T12:43:57.200Z","docketId":"MPA001219012017181357","mId":"5869efdd160812d78923ed9c","mobile":"9987464702","name":"new user","problemSummary":"g67675676","serviceComments":"ghgjghjhjthjhjthjhyjhjhjhh","serviceDescription":"hyjtyj","serviceRating":2,"serviceSubType":"Re-training request","serviceType":"Training required","source":"MPA","status":"Complete","tid":"7895451456","userName":"dummy@nseit.com","__v":0}],"start":0,"end":2,"total":2,"isLastPage":true,"isFirstPage":true} 

Answer 1

I했습니다 당신의 질문을 사용하여 여기에 몇 가지 코드를 작성하고 당신이 에 값 속성을 변경해야 할 것 같다 라디오 요소의 ng 값 속성 ng-value는 상품의 속성을 변경합니다. 여기

<input ng-value="3" class="star star-3" id="star-3" type="radio" name="star-{{$index}}" ng-model="item.rating"/> 

내 jsfiddle은 : http://jsfiddle.net/y6sc0g4k/2/

Answer 2

어떤 이유에서 모든 name 속성을 사용하지 할 수 있습니다. value에 무엇이든지 바인딩 할 필요가 없다면 ng-value을 사용해야하며 value 만 사용해야합니다. 여기 예를 살펴보세요 :

https://docs.angularjs.org/api/ng/input/input%5Bradio%5D