CSS von AngularJS ändern

Question

DOM-Änderungen von angularjs Controllern sind keine gute Übung. In meiner Anwendung, nachdem ich auf einen Link geklickt habe, ändere ich die Klasse eines HTML-Elements in ngView. Das beabsichtigte Verhalten ist, dass ich drei divs habe, und ich ändere, ob der mittlere dividiert ist oder nicht. Ich mache das von einem Controller. Ich habe gelesen, dass DOM-Manipulation in einer Direktive gemacht werden sollte, aber meine Meinung ist nicht breit genug, um eine Lösung zu finden. Bitte, wenn Sie einen Vorschlag haben, werde ich mich freuen.

Answer 1

Verwenden Sie ng-class.

zB:

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

Einige HTML:

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

Wenn Sie auf die Schaltfläche klicken, wird die Klasse des Zentrums div in Ihrem Set auf dem Boolen Wert je ändern Umfang.