肘角css類

Question

我試圖一個肘節的類的不兼容'：假到「不兼容」：使用真angularjs：

<div class="col status" style="margin-left: 63px;margin-right: 74px; width: 190px"> 
     <label class="title">Radius</label> 
     <img src="assets/images/BOTTOM SCREEN/OPERATION BOARD/SVG/button UP enable.svg" ng-click="myFunctionUp()/> 
     <div id="myDiv" class="status-bar" ng-class="{'not-compatible':false,'in-progress':false} "> 
      <label class="number-spolier">1000<span>m</span> </label> 
      <span><span></span></span> 
     </div> 
     <img src="assets/images/BOTTOM SCREEN/OPERATION BOARD/SVG/button DOWN enable.svg" ng-click="myFunctionDown()/> 
    </div> 

被點擊的IMG（第一或第二）時將該類更改爲div「myDiv」的true。

有什麼想法？

Answer 1

應該是這樣， 在HTML：

<div class="col status" style="margin-left: 63px;margin-right: 74px; width: 190px"> 
     <label class="title">Radius</label> 
     <img src="assets/images/BOTTOM SCREEN/OPERATION BOARD/SVG/button UP enable.svg" ng-click="myFunctionUp()/> 
     <div id="myDiv" class="status-bar" ng-class="{'not-compatible':isCompatible,'in-progress':false} "> 
      <label class="number-spolier">1000<span>m</span> </label> 
      <span><span></span></span> 
     </div> 
     <img src="assets/images/BOTTOM SCREEN/OPERATION BOARD/SVG/button DOWN enable.svg" ng-click="myFunctionDown()/> 
    </div> 

在控制器：

$scope.isCompatible = false; 
    $scope.myFunctionDown = function(){ 
     $scope.isCompatible = true; 
     //$scope.isCompatible = !$scope.isCompatible; //Or toggle like this 
    } 

Answer 2

ng-class不應該有「false」，但應該有模型變量的名稱。例如，如果MyFunctionDown（）設置「classStatus ='Fred'」，那麼你可以像ng-class =「{'not-fred'：classStatus！=='Fred'，'is-fred'：classStatus == = '弗雷德'}」

Answer 3

您應該說明你的範圍，如果圖像已被點擊設置標誌。您可以在此行的代碼添加到myFunctionUp和myFunctionDown功能設置範圍變量，指示IMG已經被點擊：

$scope.imgClicked = true; 

，然後只用像在納克級這個變量：

ng-class="{'not-compatible': imgClicked}" 

Answer 4

你可以簡單的使用範圍變量，而不是false在表達

{'not-compatible':false,'in-progress':false} 

見https://plnkr.co/edit/ekIrDxH9DswG3UJzRiVT?p=preview

Answer 5

試試這個例子也許會有幫助，其實你需要使用變量，而不是

https://scotch.io/tutorials/the-many-ways-to-use-ngclass 
http://codepen.io/sevilayha/pen/qlLED