Question

我在两列中显示ng-repeat内容。

使用此代码可以正常工作：

        <div class=storerow ng-repeat="store in stores track by $index" ng-if="$index%2==0">
            <div ng-repeat="i in [$index,$index+1]" ng-if="stores[i]!=null" class="ngrepeatstore">
                    <div class="image-container" style="background-image: url({{stores[i].image}})" ng-click="tileClicked({{stores[i].id}})">
                    </div>
        </div>

然而，当我添加一个过滤器时，它会破坏NG重复并且不会出现任何内容：

        <div class=storerow ng-repeat="store in stores track by $index" ng-if="$index%2==0">
            <div ng-repeat="i in [$index,$index+1] | filter: greaterThan('order', 0) | orderBy:'order'" ng-if="stores[i]!=null" class="ngrepeatstore">
                    <div class="image-container" style="background-image: url({{stores[i].image}})" ng-click="tileClicked({{stores[i].id}})">
                    </div>
        </div>

.ts for greaterThan

    $scope.greaterThan = function(prop, val){
    return function(item){
      return item[prop] > val;
    }}

我尝试将过滤器添加到第一个ng-repeat-然而这不起作用，因为它只是将过滤器应用于整体内容（即，如果只有一个项目是伟大的0，它显示所有项目 - 而不仅仅是那些项目大于0）。

Answer 1

这是因为你实际上是在告诉Angular过滤order上的属性[$index, $index + 1]，这是一个由两个整数组成的数组，这没有任何意义。

即。在您的代表比较index.prop > val时，您真正要做的就是比较index['order'] > someValue。

此Plunker演示：http://plnkr.co/edit/FkSrmZuuK4B1ToGNgAnq?p=preview您需要将filter:greaterThan(prop, val)移至父ng-repeat。只有您的过滤器才能正常工作。

<div ng-repeat="store in stores | filter:greaterThan2('id', 0) | orderBy:'name'" ng-if="$even">
  {{store.name}}
  <div ng-repeat="i in [$index, $index+1] | orderBy:angular.identity:true" ng-if="stores[i] !== null">
    <strong>store.id</strong> {{i}}
  </div>
</div>

ng-repeat内部的ng-repeat不起作用

1 个答案: