如何根据角度的两个数组制作活动项目？答案

【问题标题】：How to make active item bases on two arrays in angular?如何根据角度的两个数组制作活动项目？
【发布时间】：2018-12-11 19:09:12
【问题描述】：

我有两个数组

初始数组 - $scope.mentors = [“000”、“001”、“002”、“003”、“004”、“005”、“006”、“007”、“008”、“009” ", "010", "011", "012", "013", "014"];

和第一个数组的匹配项 - $scope.initialSelected = ["005", "009", "013", "014"];

我需要使用 currentAcc 类渲染所有 $scope.mentors 并突出显示第二个数组中的项目。我还需要通过单击来切换项目并根据突出显示的元素创建新数组。

现在我在尝试单击已初始化的高亮元素时遇到了一个错误。任何人都可以帮我解决这个问题吗？

这是我的应用示例

<div ng-controller="MainCtrl">
  <ul>
    <li ng-repeat="mentor in mentors">
       <span ng-click="toggle = !toggle;" ng-class="{'currentAcc': ifActiveAcc(toggle, '{{mentor}}' )}">{{mentor}}
       </span>
    </li>
  </ul>
</div>

function MainCtrl($scope) {
  $scope.mentors = ["000", "001", "002", "003", "004", "005", "006", "007", "008", "009", "010", "011", "012", "013", "014"];

  $scope.initialSelected = ["005", "009",  "013", "014"];

  $scope.ifActiveAcc = function(flag, num){
      var p = $scope.initialSelected.includes(num);
      if(flag == undefined) {
         if (p){
           return true;
         }
       }
       else if(flag !== 'undefined'){
        if (flag && p){
          return true;
        }
        else if(flag && !p){
          return true;
        }
        else if(!flag && p){
          return false;
        }
        else{
          return false;
        }
       }             
  } 
}

不规则 1.6.9

【问题讨论】：

这里是 jsfiddle 上的示例 jsfiddle.net/abjxpcn7/3
好吧，toggle 最初是未定义的，即使您的函数返回标志的状态，它实际上并没有改变它。因此，您的 ng-click 并没有真正从最初突出显示的项目的正确状态切换。为了可靠地解决这个问题，你真的应该让导师成为一个对象数组，保存每个对象的值和状态，这样就完全不需要你的函数了。
谢谢你的小费，有点痛苦。你能看看这里jsfiddle.net/abjxpcn7/5好吗？如何让它发挥作用？

标签： javascript arrays angularjs oop

【解决方案1】：

添加了额外的isActive 字段后，就完全不需要函数了。您可以使用简单的直接评估。

<span ng-click="mentor.isActive = !mentor.isActive" 
      ng-class="{'currentAcc': mentor.isActive}">{{mentor.name}}

看到这个小提琴：http://jsfiddle.net/c84tf7Lu/

【讨论】：