AngularJS에서 CSS 변경

Question

angularjs 컨트롤러의 DOM 변경은 좋지 않습니다. 내 응용 프로그램에서 링크를 클릭 한 후 ngView에서 html 요소의 클래스를 변경하고 있습니다. 의도 한 행동은, 내가 세 div를 가지고, 중간 하나가 표시됩니다 또는 변경하는 경우입니다. 나는 컨트롤러에서 이것을하고있다. 나는 DOM 조작을 지시문에서 수행해야한다는 것을 읽었지만 내 마음은 해결책을 찾기에 충분하지 않다. 제발, 제안이 있으면 기쁠거야.

Answer 1

ng-class을 사용하십시오.

예 :

http://jsfiddle.net/rd13/eTTZj/75/

app = angular.module('myApp', []); 

app.directive("click", function() { 
    return function(scope, element, attrs) { 
     element.bind("click", function() { 
      scope.boolChangeClass = !scope.boolChangeClass; 
      scope.$apply(); 
     }); 
    }; 
}); 

일부 HTML :

<div id="page"> 
    <div>One</div> 
    <div ng-class="{'my-class':boolChangeClass}">Two</div> 
    <div>Three</div> 
    <button click>Click me</button> 
</div> 

버튼을 클릭하면, 중앙 DIV의 클래스 내에서 설정 boolen 값에 따라 변경됩니다 범위.