javascript - 从 AngularJS 更改 CSS

Question

从 angularjs Controller 更改 DOM 不是一个好习惯。在我的应用程序中，单击链接后，我正在更改 ngView 中的 html 元素的类。预期的行为是，我有三个 div，如果显示或不显示中间的，我正在改变。我正在从 Controller 执行此操作。我读过，应该在指令中进行 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 的类将根据您范围内设置的 bool 值而改变。