Thay đổi CSS từ AngularJS

Question

Thay đổi DOM từ bộ điều khiển góc cạnh không phải là một thực hành tốt. Trong ứng dụng của tôi, sau khi nhấp vào một liên kết, tôi đang thay đổi lớp của một phần tử html bên trong ngView. hành vi dự định là, tôi có ba div, và tôi đang thay đổi nếu cái giữa được hiển thị hay không. Tôi đang làm điều này từ một bộ điều khiển. Tôi đã đọc, việc thực hiện thao tác DOM nên được thực hiện trong một chỉ thị, nhưng tâm trí của tôi không đủ rộng để tìm ra giải pháp. Xin vui lòng, nếu bạn có một gợi ý, tôi sẽ rất vui.

Answer 1

Sử dụng ng-class.

ví dụ:

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(); 
     }); 
    }; 
}); 

Một số HTML:

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

Khi bạn nhấp vào nút, lớp của div trung tâm sẽ thay đổi tùy thuộc vào giá trị boolen đặt trong bạn phạm vi.