Javascript 独占选择列表元素
我有一份无序的清单:Javascript 独占选择列表元素,javascript,angularjs,Javascript,Angularjs,我有一份无序的清单: <ul> <li ng-class="{ 'active': selected }" ng-click="selected = !selcted">Stuff 1</li> <li ng-class="{ 'active': selected }" ng-click="selected = !selcted">Stuff 2</li> <li ng-class="{ 'active':
<ul>
<li ng-class="{ 'active': selected }" ng-click="selected = !selcted">Stuff 1</li>
<li ng-class="{ 'active': selected }" ng-click="selected = !selcted">Stuff 2</li>
<li ng-class="{ 'active': selected }" ng-click="selected = !selcted">Stuff 3</li>
</ul>
- 1
- 2
- 3
我想对用户选择的列表项应用一个类。一次只能有一个项具有该类。最好的方法是什么?大约有十几个元素,所以我不想为每个项目声明一个新变量。为每个项目设置一个属性:
<ul>
<li ng-class="{ 'active': selected == 1 }" ng-click="selected = 1">Stuff 1</li>
<li ng-class="{ 'active': selected == 2 }" ng-click="selected = 2">Stuff 2</li>
<li ng-class="{ 'active': selected == 3 }" ng-click="selected = 3">Stuff 3</li>
</ul>
- 1
- 2
- 3
如果需要,请使用ng repat
HTML
我希望人们能解释他们的反对票:)
<ul ng-repeat="s in stuffs">
<li ng-class="{active:$index==selected}" ng-click="selected=$index">{{s}}</li>
</ul>
$scope.stuffs = ['Stuff 1', 'Stuff 2', 'Stuff 3'];