Question

相当含糊的问题，希望这会更好地解释。我抓住了以下JSON：

{
  items: [
    { name: "item 1", options: [1, 2, 3] }, 
    { name: "item 2", options: [2, 3] }, 
    { name: "item 3", options: [1] }
  ],
  options: [
    { id: 1, color: "red" }, 
    { id: 2, color: "blue" }, 
    { id: 3, color: "yellow" }
  ]
}

我正在重复这样的项目：

<div data-ng-repeat="item in items">
  <span>{{ name }}</span>
  <ul>
    <li data-ng-repeat="i in item.options">{{i}}</li>
  </ul>
</div>

理想情况下，我希望能够在我的第二个ng-repeat循环（而不仅仅是数字原语）中访问颜色参数（和其他参数）。最好的方法是什么？我在初始化时是否应该在每个项目的选项数组上执行映射，并将每个索引转换为完整对象（具有id和颜色）？或者我可以将索引传递给控制器，查看并使用我查找的选项扩展我的范围吗？

Answer 1

<li data-ng-repeat="i in item.options">{{options[i-1].color}}</li>

编辑：如果选项数组未排序：

<li data-ng-repeat="i in item.options">{{getColor(i)}}</li>

<强> controller.js ：

$scope.getColor = function(i) {
  for(var index=0, len=$scope.options.length; index<len; index++) {
    if ($scope.options.index.id===i) return $scope.options.index.color;
  }
}

Answer 2

一种选择是使用函数来获取与您的项目相关联的选项。

http://plnkr.co/edit/RZvH2lWilQaIUJTq4DUL?p=info

  <body ng-controller="MainCtrl">
    <div data-ng-repeat="item in items">
      <span>{{ name }}</span>
      <ul>
        <li data-ng-repeat="i in getOptions(item.options)">{{i.color}}</li>
      </ul>
    </div>
  </body>

app.controller('MainCtrl', function($scope) {
  $scope.items = [
    { name: "item 1", options: [1, 2, 3] }, 
    { name: "item 2", options: [2, 3] }, 
    { name: "item 3", options: [1] }
  ];
  $scope.options= [
    { id: 1, color: "red" }, 
    { id: 2, color: "blue" }, 
    { id: 3, color: "yellow" }
  ];

  $scope.getOptions = function(options) {
    var rv = [];
    angular.forEach($scope.options, function(option, idx){
       if(options.indexOf(option.id) > -1)
       {
         rv.push(option);
       }
     });
    return rv;
  }
});

Answer 3

最好的方法是将JSON中的options部分作为此结构返回

options: {
    "1": "red", 
    "2": "blue", 
    "3": "yellow"
}

然后您可以通过密钥访问它，因为它是一个JavaScript对象：

<li data-ng-repeat="i in item.options">{{options[i]}}</li>

AngularJS - 重复ID数组，我该如何查找它们？

3 个答案: