通過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爲黃色」

Answer 2

您需要做這樣的事情

<td ng-repeat="group in groups" ng-class="{'selected': check == group.title}" ng-click="select(group)">{{group.title}}</li> 

在CSS確保您有這個選擇的類控制器進行定義

.selected { 
    background: 'red'; 
} 

$scope.check = ''; 

$scope.select = function (group) { 
    $scope.check = group.title 
}; 

看到這個plunker http://plnkr.co/edit/pLbLMWsJ7A6Zr1Z9uAmz?p=preview