Question

有一个HTML表格，我为每一行添加SET按钮： -

<table cellpadding="0" cellspacing="0">
    <thead>
        <tr>
            <th>Row1</th>
            <th>Row2</th>
            <th>Row3</th>
            <th>Row4</th>
            <th>Row5</th>
            <th>Row6</th>
            <th>Row7</th>
            <th>Row8</th>
            <th>Row9</th>
            <th>Row10</th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="row in array track by $index" ng-class="{'selected': isSelected(row.value1)}" ng-click="selectRow(row.value1)">
            <td>{{row.value1}}</td>
            <td>{{row.value2}}</td>
            <td>{{row.value3}}</td>
            <td>{{row.value4}}</td>
            <td>{{row.value5}}</td>
            <td>{{row.value6}}</td>
            <td>{{row.value7}}</td>
            <td>{{row.value8}}</td>
            <td>{{row.value9}}</td>
            <td>{{row.value10}}</td>
            <td><button type="button" ng-disabled = "setBtnDisable" 
           class="btn btn-xs btn-primary" data-ng-click="show()">SET</button></td>
        </tr>
    </tbody>
</table>

我的角度指令代码： -

scope.setBtnDisable = true;//Default value
scope.selectedRow = null;//Default value

            scope.selectRow = function(rowID){
                if (scope.isSelected(rowID)){
                    scope.setBtnDisable = true;
                    scope.selectedRow = null;
                } else {
                    scope.setBtnDisable = false;
                    scope.selectedRow = rowID;
                }
            };

            scope.isSelected = function(rowID){
                return (scope.selectedRow == rowID);
            };

我想要做的是，仅为该特定选定行启用SET按钮，并使剩余行的SET按钮保持禁用状态。但是现在当我点击任何一行时，所有按钮都被启用了。谁能告诉我解决方案只启用选择行的SET按钮？

Answer 1

代码中的一切似乎都很好，因为您在按钮中使用变量来设置ng-disabled，当设置为true时，它适用于所有表行。

<强>解决方案：

对ng-disabled使用相同的函数但反转布尔值。因此，每行都是唯一的，您将获得所需的结果！像这样。

<button type="button" ng-disabled="!isSelected(row.value1)" 
class="btn btn-xs btn-primary" data-ng-click="show()">SET</button>

JSFiddle Demo

Answer 2

您好我的问题我认为是setBtnDisable cuse它是一个适用于所有行..

如果您尝试以下内容会怎样：

    scope.setBtnDisable = [array.length];
scope.setBtnDisable.forEach(function(item){
item = false;
});
    scope.selectedRow = null;//Default value

                scope.selectRow = function(rowID){

                        scope.setBtnDisable[rowID] = !scope.setBtnDisable[rowID] ;
                        scope.selectedRow = null;

                };

                scope.isSelected = function(rowID){
                    return (scope.selectedRow == rowID);
                };

如何为启用的特定选定行设置按钮？

2 个答案: