AngularJS洗牌并限制到列表

我想使用AngularJS显示一个无序列表，但只显示前两个元素。目前，我在HTML模板中执行洗牌和限制，如所示：

{{value}}

这可以正常工作，但当列表中的项目多于显示的项目时，会导致Angular迭代次数超过10次，如示例所示。据我所知，正在发生的事情是，某些东西正在监视列表的过滤和限制值，当所有元素不总是显示时，这些值很可能会发生变化

如何在不破坏角度的情况下实现此效果？当然，它仍然像它应该的那样工作，但它是低效的，并且可能表明我所做的是不正确的，应该以其他方式实现

显而易见的解决方案是在显示列表之前在控制器中对列表进行洗牌，但我确实希望每次用户更新视图时显示的元素选择都会发生变化

---

编辑：以下是我试图实现的一个目标-该应用程序现在允许您在两个列表之间切换，每次都会被洗牌和限制。

我认为tgat的问题在于您的过滤器修改源数组。即使您返回新数组，这也是一个问题。这就是脏检查的工作原理：它不断计算表达式，直到它“稳定”（或10次迭代）。这篇文章描述了更多内容：

---

解决方案是对控制器中的值进行预洗牌，以便表达式在每个脏检查阶段返回相同的值。。。抱歉，但这是目前最好的方法（除非您不想使用$$hash玩肮脏的游戏，让ngRepeat beleave将您的表达式计算为相同的值：）

如前所述-angular等待表达式稳定。 因此，最好的方法是在将数组传递给视图之前对其进行洗牌。 无论如何，这里有一些技巧，可以帮助你保持清洁

在这个提琴中，我们缓存洗牌结果，而长度保持不变。所以，当数组的长度改变时，而不是当数组改变时，数组被重新洗牌。您可以实现更复杂的缓存行为。因此，主要思想是只对同一数组进行一次洗牌，并仅在数组更新时对其进行重新洗牌

当前的筛选器实现非常糟糕，因为它只缓存单个数组，所以如果您使用此筛选器两次，它将被破坏。因此，缓存应该使用hashKey之类的方法来实现，以区别不同的数组

shufflemodule.filter('shuffle', function() {
    var shuffledArr = [],
        shuffledLength = 0;
    return function(arr) {
        var o = arr.slice(0, arr.length);
        if (shuffledLength == arr.length) return shuffledArr;
        for(var j, x, i = o.length; i; j = parseInt(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
        shuffledArr = o;
        shuffledLength = o.length;
        return o;
    };
});

---

无论如何，在筛选器中修改作用域中的数据不是一个好的做法。如果您需要共享这个洗牌数组-在您的控制器/服务/中洗牌它。。。。因此，

var o=arr.slice（0，长度）

复制该数组，因此我们保持原始数组不变。

演示了“控制器中的过滤器”方法。与实际创建过滤器不同，洗牌被定义为一个常规函数，并应用于

$scope.array

控制器中应该有一个执行洗牌的函数，然后在洗牌列表中重复ng。只要您想更新，就可以调用重新洗牌函数。@AndyJoslin我想这是我必须采取的方法。