javascript - 通过 ng-click 更改单元格颜色

Question

当我点击我的按钮时，我的单元格颜色发生了变化，但是当我第二次点击时，我的颜色单元格没有保留。

我希望当我第二次点击另一个按钮时，我的第一个单元格保持颜色

第一次点击:

第二次点击:

HTML:

<table class="table table-striped table-bordered" cellspacing="0" width="100%">
    <thead>
    <tr class="warning">
        <th>Key</th>
        <th>Valeur version {{application.version}}</th>
        <th></th>
        <th>Valeur version {{applicationcible.version}}</th>
    </tr>
    </thead>

    <tbody ng-repeat="group in groups">
    <tr>
        <td class="danger" colspan="4" ng-click="hideGroup = !hideGroup">
            <a href="" ng-click="group.$hideRows = !group.$hideRows">
                <span class="glyphicon" ng-class="{ 'glyphicon-chevron-right': group.$hideRows, 'glyphicon-chevron-down': !group.$hideRows }"></span>
                <strong>{{group.name}}</strong>
            </a>
        </td>
    </tr>
    <tr ng-repeat-start="member in group.members" ng-hide="hideGroup">
        <td rowspan="2">
                {{ member.name }}
        </td>
        <td rowspan="2" ng-class="{selected: $index==selectedRowLeft}">{{ member.valueRef }}</td>
        <td class="cube" >
            <div  ng-if="group.id != 1">
                <button type="button"  ng-click="moveLeft($index, group)" ><span class="glyphicon glyphicon-chevron-left"></span></button>
             </div>
        </td>
        <td rowspan="2" ng-class="{selected: $index==selectedRowRight}">{{ member.valueCible }}</td>
    </tr>
    <tr ng-repeat-end ng-hide="hideGroup" >
        <td class="cube" >
            <div ng-if="group.id != 2">
                <button type="button"  ng-click="moveRight($index, group)"><span class="glyphicon glyphicon-chevron-right"></span></button>
             </div>
        </td>
    </tr>
    </tbody>
</table>

CSS:

.selected { background-color: #ffff05; }

JS:

scope.moveLeft = function (index, group) {
                move(scope.properties, group.id, index, 'left');
            };

            scope.moveRight = function (index, group) {
                move(scope.propertiescible, group.id, index, 'right');
            };

            var move = function (properties, groupId, origin, destination) {
                unregister();
                var value;
                if (destination === 'right') {
                    scope.selectedRowRight = origin;
                } else {
                    scope.selectedRowLeft = origin;
                }
...

Answer 1

您可能需要创建一个数组来保留选中的单元格，从而更改背景颜色。此外，您还需要更改 ng-click 函数以检查数组，并实现以下逻辑“如果选中的单击行有一条记录，则将其 bg-color 更改为黄色”