if 문으로 CSS 스타일 변경

Question

Atm 회원이 보유한 상태를 표시하는 테이블이 있습니다. ~을 할 수 있습니까? 회원 상태 = 청동 -> 청년 배경 = 청동입니까? 죄송합니다. 문제가 명확하지 않으면 회원 자격 상태에 따라 배경색을 변경하고 싶습니다. 나는 그것을 어떻게 할 수 있겠습니까?

var app = angular.module('test', []); 
      app.filter('status', function() { 
       return function (input) { 
        var statu = input; 
        switch (input) { 
         case 10: 
          statu = 'Bronze'; 
          break; 
         case 20: 
          statu = 'Silver'; 

          break; 
         case 30: 
          statu = 'Gold'; 
          break; 
         case 40: 
          statu = 'Elite'; 
          break; 
        } 
        return statu; 

       }; 
      }); 

Answer 1

ng-class 지시문을 사용할 수 있습니다. 예를 들어

:

보기

.bronze { 
    background-color: red; 
} 
.silver{ 
    background-color: gray; 
} 


$scope.items = [ 
    {color: 'bronze'}, 
    {color: 'silver'} 
]; 


<div ng-repeat="item in items" 
    ng-class="{bronze: item.color == 'bronze', silver: item.color == 'silver'}"> 
</div> 

Answer 2

조건부 내가 제안하는 클래스를 변경하려면 ng-class

예 : 그래서 같은

app.controller('TestCtrl', function() { 
    $scope.show = false; 

    if(condiiton) { 
     $scope.show = true; 
    } 

}); 

그리고 보완하여 HTML :이 예는 '아무튼 경우 자세한 내용은 여기를

<input ng-class="{ show: classname }"> 

읽기 t 충분 : https://docs.angularjs.org/api/ng/directive/ngClass

Answer 3

, 제어부 컨트롤러

<td ng-style="changeBgColor(member.status)"> 

내부 changeBgColor 함수

$scope.changeBgColor = function(status) { 
    var statu = status; 
    switch (status) { 
     case 10: 
      statu = 'Bronze'; 
      break; 
     case 20: 
      statu = 'Silver'; 
      break; 
     case 30: 
      statu = 'Gold'; 
      break; 
     case 40: 
      statu = 'Elite'; 
      break; 
     } 
     return {'background-color': statu}; 
}