我的列表如下......
<ul id="menu">
<li>one</li>
<li>two</li>
<li>three</li>
</ul>
现在,当点击特定的li
时,我希望将active
类添加到同一个类中,并从active
元素的其余部分中删除li
类。此外,再次点击相同的li
时,我想删除active
类。
我是如何使用ng-click
和ng-class
?
答案 0 :(得分:1)
检查以下示例:
var myApp = angular.module('myApp', []);
myApp.controller('MyCtrl', ['$scope', function($scope) {
$scope.setMaster = function(section) {
$scope.selected = section;
}
$scope.isSelected = function(section) {
return $scope.selected === section;
}
}]);
.active {
background-color: orange;
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
<ul>
<li ng-repeat="i in ['One', 'Two', 'Three']" ng-class="{active : isSelected(i)}">
<a ng-click="setMaster(i)">{{i}}</a>
</li>
</ul>
<hr> {{selected}}
</div>