3

我有一个看起来像这样的大对象：

scope.marketplaces = {

    first_example : { ... },
    second_example : { ... },

    ...

};

我想做的是像这样循环遍历大对象：

<section>
    <ul>
        <li ng-repeat="(key, value) in marketplaces"></li>
    </ul>
</section>

在循环内部，再次循环每个对象，而不是附加到 DOM 中，例如：

<li> ... first level loop ...

    <li> ... second level loop ... </li>
</li>

<li></li>尽管我正在循环播放关卡，但我只想拥有一个。我想要这样的原因是因为我需要key从第一个循环向下引用级别循环并且仍然只有一个li.

我读过它ng-repeat="friend in friends | filter:searchText"可以做我想做的事，但我不确定在过滤器表达式中我是否可以动态指定key需要的或其他东西，而不是searchText（我猜这是对象的已知属性）。

所以我的问题是，我可以实现我刚才解释的内容，filter还是有另一种方法？

4

1 回答 1

4

我希望我已经理解了问题：您希望在嵌套对象上有一个 ngRepeat。如此线性化对象。

第一种方法是创建过滤器：

app.filter('linear', function() {
  return function(value) {
    var result = {};
    for(var key in value) {
      for(var cKey in value[key]) {
        result[key+'_'+cKey] = value[key][cKey];
      }      
    }
    return result;
  };
});

在 thml 中：

<li ng-repeat="(key, value) in marketplaces | linear">
          {{key}}: {{value}}
</li>

但不幸的是，AngularJS 在过滤器中创建新元素时会出现问题。您可以在控制台类型中显示错误消息：

10 $digest iterations reached

如果没有 hack，$$hash您现在无法实现该功能（如果我错了，请纠正我）。

所以我认为目前的解决方案是在控制器中观看“市场”并使用与在 ngRepeat 中使用的控制器中相同的代码创建新对象：

$scope.$watch('marketplaces', function(value) {
    var result = {};
    for(var key in value) {
      for(var cKey in value[key]) {
        result[key+'_'+cKey] = value[key][cKey];
      }      
    }
    $scope.linearMarketplaces = result;

  }, true);

在 HTML 中：

    <li ng-repeat="(key, value) in linearMarketplaces">
      {{key}}: {{value}}
    </li>

Plunker 两种解决方案：http ://plnkr.co/edit/pYWFhqSqKAa9gpzek77P?p=preview

于 2013-02-17T15:57:27.293 回答