Question

我有2 ng重复与toArray和grouptBy，以显示分组中的数组，每个重复类型作为节头：

<div ng-repeat="feed in feeds | groupBy:'type' | toArray:true">
  <section layout="row" layout-sm="column" layout-align="center" layout-wrap>
    <div>{{feed.$key}}</div>
    <md-button class="md-raised" ng-class="{'md-primary': !item.hide}"
          ng-click="toggleFeed($index)" ng-repeat="item in feed">
      {{item.name}}
    </md-button>
  </section>

我正在尝试获取原始$index，以便我可以更快地访问$scope.feeds（使用$scope.feeds[$index]）。

现在$index给我第二个循环中的索引，$parent.$index给我父项（第一个）循环的索引，但我在点击子项时尝试获取原始索引

有什么想法吗？

Answer 1

正如在评论中已经解释的那样，解析所选对象而不是$index要好得多。这样，您就不需要为索引/对象/数组更改而烦恼（例如过滤或排序）。

好方法：

<div ng-repeat="feed in feeds | groupBy:'type' | toArray:true">
    <section layout="row" layout-sm="column" layout-align="center" layout-wrap>
        <div>{{feed.$key}}</div>
        <md-button class="md-raised" ng-class="{'md-primary': !item.hide}"
                   ng-click="toggleFeed(item)" ng-repeat="item in feed">
            {{item.name}}
        </md-button>
    </section>
</div>

最糟糕的方式：

只有通过不必要的迭代才能保持原始索引。在将数据解析到视图范围之前，您需要准备数据。我不建议这样做，因为它并不是那么高效。保持简单并将对象解析为toggleFeed()函数。

$scope.data = [{
    someAttribute: 'value'
},{
    someAttribute: 'value'
},{
    someAttribute: 'value'
},{
    someAttribute: 'value'
},{
    someAttribute: 'value'
},{
    someAttribute: 'value'
},{
    someAttribute: 'value'
}];

$scope.data.forEach(function(item, index) {
    $scope.data[index].originalIndex = index;
});

$scope.feeds = $scope.data;

通过这种方式，您可以解析函数的原始索引：

<div ng-repeat="feed in feeds | groupBy:'type' | toArray:true">
    <section layout="row" layout-sm="column" layout-align="center" layout-wrap>
        <div>{{feed.$key}}</div>
        <md-button class="md-raised" ng-class="{'md-primary': !item.hide}"
                   ng-click="toggleFeed(feed.originalIndex)" ng-repeat="item in feed">
            {{item.name}}
        </md-button>
    </section>
</div>

第一种方法很简单，性能更高。

使用toArray和groupBy获取ng-repeat的原始$ index

1 个答案:

好方法：

最糟糕的方式：