0

我正在尝试使列表类对该列表成员的 ID 是否在数组中作出反应。我可以用控制器中的一个函数来处理它，但是如果数组发生变化，它不会自动更新类。

这是一个代表我的问题的 plunker，我希望所有的 id$scope.redIds都是红色的。 http://plnkr.co/edit/rl8WWgTRnksDkEddmhj9

下面的代码：

<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example - example-ngController-production</title>


  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.min.js"></script>
  <script src="app.js"></script>

  <style>
    .red {
      background-color: red;
    }
  </style>


</head>
<body ng-app="controllerExample">
  <div ng-controller="controller">
    <!-- 1 and 4 should be red -->
    <div ng-repeat="id in ids">

      <span ng-class="id in redIds ? 'red' : ''">ID: {{id}}</span>
    </div>
  </div>
</body>
</html>

应用程序.js：

(function(angular) {
angular.module('controllerExample', [])
  .controller('controller', ['$scope', controller]);

function controller($scope) {
  $scope.ids = [1,2,3,4];
  $scope.redIds = [1,4];
}
})(window.angular);

谢谢！

EDIT Plunker 已经更新了工作解决方案：http: //plnkr.co/edit/rl8WWgTRnksDkEddmhj9

4

1 回答 1

2

基本上你有错误的ng-class指令，它不应该使用id in redIds表达式不起作用，这种代码只适用于ng-repeat.

为了让这个工作你可以.indexOf在这里使用，它会检查redIds数组是否包含id元素。

标记

<div ng-repeat="id in ids">
   <span ng-class="{'red': redIds.indexOf(id) != -1}">ID: {{id}}</span>
</div>

演示 Plunkr

于 2015-08-23T20:34:18.653 回答