AngularJs - 在表格中设置单选按钮值

Posted 2023-03-05

【中文标题】AngularJs - 在表格中设置单选按钮值

【英文标题】：AngularJs - set radio button value in a table

【发布时间】：2018-11-27 14:48:02

【问题描述】：

我正在尝试自动设置单选按钮，以便在我单击其父表的单元格时进行检查，并且还需要能够从按钮中清除选择。

这是我的代码，我无法让它工作。我确实看过这个帖子How to select a radio button by default?，但它还没有帮助我。

<tbody>
            <tr ng-repeat="row in wm.rows ">
                <td class="col-xs-3 matrix-table-td matrix-table-td-alignleft" 
                    ng-class="selected: row.valueName === wm.selectedRow">
                    row.valueName
                </td>
                <td class="matrix-table-td"
                    ng-repeat="column in wm.columns track by $index"
                    ng-click="wm.valueClick(row, column, $index);"
                    ng-class="'nodata':  wm.getCellValue(row, column, 'inventoryId')===null, 'selected': $index === wm.selectedIndex && row.valueName===wm.selectedRow">
                    <span ng-if="!wm.selectorOnly"> wm.getCellValue(row, column, wm.selectedField)</span>
                    <input type="radio" name="cellSelector"
                           ng-model="wm.selectedInventoryId"
                           ng-value="wm.selectedInventoryId"
                           ng-if="wm.selectorOnly"/>
                </td>
            </tr>
        </tbody>

所以，valueClick 方法设置了 selectedInventoryId，但我的单选按钮似乎有自己的想法。当我单击单元格时，通常会选择另一个单选按钮。你知道我怎样才能让我的网格工作吗？我希望单选按钮单击选择单元格或反之亦然。

【问题讨论】：

您能否在问题中包含您的控制器代码？

【参考方案1】：

我能够让它工作。我现在正在使用：

<input type="radio" name="cellSelector"
                           ng-model="wm.selectedIdentifier"
                           value="row.tmplatId.toString() + '_' + column.tmplatId.toString()"
                           ng-if="wm.selectorOnly"/>

在我的 valueClick 方法中，我使用了我添加的这个新属性 (selectedIdentifier)，我将其设置为该值并在按钮中设置为空字符串以清除选定内容。现在似乎工作得很好。