我有以下代码:
<!DOCTYPE html>
<html data-ng-app>
<head>
<title></title>
<style>
.menu-disabled-true {
color: gray;
}
.menu-disabled-false {
color: red;
}
.menu-disabled-green {
color: green;
}
</style>
</head>
<body >
<script src="angular.min.js"></script>
<script>
function DeathrayMenuController($scope) {
$scope.isDisabled = false;
$scope.stun = function() {
// stun the target, then disable menu to allow regeneration
if($scope.isDisabled == 'false'){
$scope.isDisabled = 'true';
}else if($scope.isDisabled == 'true'){
$scope.isDisabled = 'green';
}
};
}
</script>
<div ng-controller='DeathrayMenuController'>
<ul>
<li class='menu-disabled-{{isDisabled}}' ng-click='stun()'>Stun</li>
</ul>
</div></body>
</html>
现在,每当我点击Stun <li>
然后我希望它根据 Controller 内部的方法改变颜色。
有人可以帮助我理解为什么它不起作用吗?
最佳答案
问题是您正在比较字符串值和 bool 值。
将声明更改为 'false'(字符串)
$scope.isDisabled = 'false';
$scope.stun = function() {
// stun the target, then disable menu to allow regeneration
if($scope.isDisabled == 'false'){
$scope.isDisabled = 'true';
}else if($scope.isDisabled == 'true'){
$scope.isDisabled = 'green';
}
};
关于css - AngularJS:条件语句在 Controller 的 Angular JS 方法中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20262898/