0

我正在使用 ngRepeat 和 ngIf 来过滤/排序（？）一些数据。我最初考虑为此使用 ngSwitch 而不是 ngIf，但找不到一个很好的例子。在摸索了稍微复杂一点的 ngSwitch 之后，我决定尝试一下 ngIf。只花了大约 5 分钟就弄清楚了如何用 ngIf 实现我想要的，所以这是一个很大的优势！但是，我需要使用 ngRepeat 和 ngIf 两次来实现我想要的输出。如果可能的话，我想把它降低到一个 ngRepeat，因为我认为这是更昂贵的指令。

主要的html如下：

<body ng-app="app">
    <div ng-controller="Controller2 as ctrl2">
        <h4>City1</h4>
        <div ng-repeat="place in ctrl2.places">
            <div ng-if="place.city1 === true">
                {{place.name}}
            </div>
        </div>
        <h4>City2</h4>
        <div ng-repeat="place in ctrl2.places">
            <div ng-if="place.city1 === false">
                {{place.name}}
            </div>
        </div>
    </div>
</body>

输出如下所示：

City1

Place1
Place3

City2

Place2

您可以看到我为places变量的每个元素使用了一个布尔属性。如果需要，我可以提供更多代码。

有没有办法在不使用两个ng-repeat指令的情况下获得所需的输出？ngSwitch 会比 ngIf 更好吗？

编辑：

控制器代码：

(function() {

    'use strict';

    angular
        .module('app')
        .controller('Controller2', Controller2);

    function Controller2() {

        this.places = places;
    }

    var places = [
        {
            name: 'Place1',
            city1: true,
        },
        {
            name: 'Place2',
            city1: false,
        },
        {
            name: 'Place3',
            city1: true,
        }
    ];
})();
4

1 回答 1

2

您可以在 ng-repeats 中使用过滤器并摆脱 ng-ifs：

<div ng-controller="Controller2 as ctrl2">
    <h4>City1</h4>
    <div ng-repeat="place in ctrl2.places | filter: {city1: true}">        
        {{place.name}}
    </div>
    <h4>City2</h4>
    <div ng-repeat="place in ctrl2.places | filter: {city1: false}">        
        {{place.name}}        
    </div>
</div>
于 2015-07-17T17:09:47.917 回答