无法使用ng-repeat选择多个收音机选项

Question

我正在参加考勤模块。在我使用ng-repeat从数据库显示工作人员名单的情况下，我们可以选择Present和Absent无线电选项，但我们只能选择特定人员的在场或缺席。

这是我的工作人员名单代码：

<tbody data-ng-init="get_staff()"> 
    <tr ng-repeat="staff in pagedItems"> 
     <td data-title="Sl.No">{{ staff.slno }}</td> 
     <td data-title="Staff Id">{{ staff.StaffId }}</td> 
     <td data-title="Name">{{ staff.Name }}</td> 
     <td data-title="Present"><input type="radio" name="attendance" id="attendance" data-ng-model="staff.attendance" value="{{staff.StaffId}}"></td> 
     <td data-title="Absent"><input type="radio"name="attendance" id="attendance" data-ng-model="staff.attendance" value="{{staff.StaffId}}"></td> 
    </tr> 
</tbody> 

<tfoot> 
    <tr> 
     <td colspan="7"> 
      <button type="button" class="btn btn-theme" data-ng-click="add_detail()">Next</button> 
     </td> 
    </tr> 
</tfoot>  

1）无法选择多个工作人员，存在或不存在
2）无法区分存在和不存在提交
3）后，如果我选择只有一个作为目前无线选项的未选中的员工

这里是我的AngularJS代码

$scope.add_detail=function() 
{  
    var comArr = eval($scope.pagedItems); 
    var attendance=new Array(); 
    for(var i = 0; i < comArr.length; i++) 
    { 
     attendance.push(comArr[i].attendance); 
     alert(attendance); 
    } 
}; 

我是AngularJS的新手。请引导我。提前致谢！

Answer 1

在HTML5中，radiobutton分组为名称属性。在这里ng-repeat，你只是分配每个单选按钮与相同的name，请为不同的单选按钮组指定不同的名称。

例如（吴重复的每一行单选分组）：

<tr ng-repeat="staff in pagedItems"> 
    <td data-title="Sl.No">{{ staff.slno }}</td> 
    <td data-title="Staff Id">{{ staff.StaffId }}</td> 
    <td data-title="Name">{{ staff.Name }}</td> 
    <td data-title="Present"><input type="radio" name="{{'attendance' + $index}}" id="attendance" data-ng-model="staff.attendance" value="{{staff.StaffId}}"></td> 
    <td data-title="Absent"><input type="radio"name="{{'attendance' + $index}}" id="attendance" data-ng-model="staff.attendance" value="{{staff.StaffId}}"></td> 
</tr>