Question

我有一个场景，我有静态列表元素，我需要使用ng-class添加活动类，当我点击list元素时，将添加活动类。

这是我的代码：

vm.idArry = [];
vm.selectedFunc = function (item) {
    item.selected = !item.selected;
    if(vm.idArry.indexOf(item) == -1){
        vm.idArry.push(item);

    }
    else {
        var index =  vm.idArry.indexOf(item);
         vm.idArry.splice(index, 1);
    }
  }

HTML：

<ul>
            <li id="one"><a ng-class="{'active':item.selected}" ng-click="selectedrFunc(1)" ></a></li>
            <li id="two"><a ng-class="{'active':item.selected}" ng-click="selectedFunc(2)" ></a></li>
            <li id="three"><a ng-class="{'active':item.selected}" ng-click="selectedFunc(3)"></a></li>
            <li id="four"><a ng-class="{'active':item.selected}" ng-click="selectedFunc(4)" ></a></li>
            <li id="five"><a ng-class="{'active':item.selected}" ng-click="selectedFunc(5)"></a></li>
            <li id="six"><a ng-class="{'active':item.selected}" ng-click="selectedFunc(6)" ></a></li>

对于上面的代码，当我点击列表元素时，我必须得到追加活动类（即，当我点击多个列表元素时，必须添加多个列表活动类）。

提前致谢。任何帮助将不胜感激。

Answer 1

删除item.selected的使用并使用以下代码：

<li id="one"><a ng-class="{'active': vm.idArry.indexOf(1) != -1}" ng-click="selectedFunc(1)" >A</a></li>

这将检查vm.idArray中的项目是否存在;同时删除item.selected

上的vm.selectedFunc

所以你的vm.selectedFunc应该是这样的：

vm.selectedFunc = function (item) {
    if(vm.idArry.indexOf(item) == -1){
        vm.idArry.push(item);

    }
    else {
        var index =  vm.idArry.indexOf(item);
         vm.idArry.splice(index, 1);
    }
  }

如何使用ng-class为列表元素应用活动类（mutli-select）？

1 个答案: