5

我正在尝试使用 ng-repeat 制作一个表格，该表格在每行的开头都有一个单选按钮选择器。该表如下所示：

<table>
     <tbody>  
         <tr ng-repeat="model in modelList">
              <td>
                 <input type="radio" ng-model="model.select"></input>
              </td>
             <td>{{ model.NDPName }}</td>
             <td>{{ model.OEM }}</td>
             <td>{{ model.version }}</td>
             <td>{{ model.dateAdded }}</td>
             <td>{{ model.validUntil }}</td>
         </tr>
     </tbody>
</table>

ng-repeat 取自一个看起来像这样的模型列表：

    $scope.modelList =
    [
        {
            select: false,
            NDPName: "NDP1",
            OEM: "CHOAM Inc.",
            version: "01",
            dateAdded: "Jan 1, 2013",
            validUntil: "Jan 1, 2014",
        },
        {
            select: false,
            NDPName: "NDP2",
            OEM: "Tyrell Corp.",
            version: "01",
            dateAdded: "Jan 1, 2014",
            validUntil: "Jan 1, 2015",
        },
        {
            select: false,
            NDPName: "NDP3",
            OEM: "Stark Industries",
            version: "01",
            dateAdded: "Jan 1, 2015",
            validUntil: "Jan 1, 2016",
        },
        {
            select: false,
            NDPName: "NDP4",
            OEM: "Monsters Inc.",
            version: "01",
            dateAdded: "Jan 1, 2016",
            validUntil: "Jan 1, 2017",
        },
        {
            select: false,
            NDPName: "NDP5",
            OEM: "ACME Corp",
            version: "01",
            dateAdded: "Jan 1, 2017",
            validUntil: "Jan 1, 2018",
        }
    ];

我遇到的问题是单选按钮的行为不像单选按钮。它们每个都在一个单独的范围内，因此将允许选择表中的多行。我怎样才能解决这个问题？

4

2 回答 2

14

您需要为name单选按钮设置一个属性，以便将它们组合在一起。

<input type="radio" name="groupName" ng-model="model.select" />

在此处阅读有关 name 属性的信息

于 2013-08-23T15:04:15.300 回答
1

您应该在输入中指定名称标签。然后所有输入将属于同一组并且将按预期运行：

<input type="radio" name="myGroup" ng-model="model" />
于 2013-08-23T15:03:38.947 回答