在 ng-click 上切换 css
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19772033/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Toggle css on ng-click
提问by Diolor
This is the basic idea of my code:
这是我的代码的基本思想：
HTML (jade):
HTML（玉）：
#preferencesBox(ng-click="toggleCustom()")
.glyphicon.glyphicon-heart
CSS:
CSS：
#preferencesBox.active{
color: #d04f37;
}
Angular:
角度：
$scope.check = true;
$scope.toggleCustom = function() {
$scope.check = $scope.check === false ? true: false;
};
I want to add the css color : #d04f37when the user clicks the parent #preferencesBox. Adding/removing .activeis the jQuery way. How should my ng-classor the rest code look like?
我想color : #d04f37在用户单击 parent 时添加 css #preferencesBox。添加/删除.active是 jQuery 方式。我的ng-class或其余的代码应该是什么样的？
回答by tymeJV
You can use an expression inside ng-classthat will watch the checkvariable:
您可以在内部使用一个表达式ng-class来监视check变量：
ng-class="{'active' : check}"
When check= true, add class active
当check= 时true，添加类active
回答by danielrozo
Take a look at the next example and apply in Jade:
看下一个例子并在 Jade 中应用：
<header ng-click="click()" ng-class="{'active': active == true}">Hello</header>
Then, in your controller:
然后，在您的控制器中：
$scope.click = function(){
$scope.active = true;
}
I'd say this is simple enough to get you started and add logic for toggling into click()(it's only an if).
我想说这很简单，可以让您开始并添加切换逻辑click()（它只是一个if）。
