AngularJS 中ng-class 使用
我们说到在angular开发中angular controller never 包含DOM元素(html/css),在controller需要一个简单的POJO(plain object javascript object),与view完全的隔离(交互angularjs框架的职责。但在某些项目中看见controller涉及DOM的元素最多的是在controller scope上定义某变量,其值为class name,形如: function ctr($scope){ $scope.test =“classname”; } <div class=”{{test}}”></div> 这种方式完全没错,是angular提供的一种改变class的方式,但是在controller涉及了classname在我看来是乎总是那么诡异,我希望的是controller是一个干净的纯javascript意义的object。 我们继续其他两种解决方案: function Ctr($scope) { $scope.isActive = true; } <div ng-class="{true: 'active',false: 'inactive'}[isActive]"> </div> 其结果是2中组合,isActive表达式为true,则 active,负责inactive。 2对象key/value处理主要针对复杂的class混合,其形如: function Ctr($scope) {
}
<div ng-class {'selected': isSelected,'car': isCar}">
</div>
|