在ng-repeat

Question

我的应用程序中有一个评论部分，我正在重复。我试图解释有大量评论的情况。我的想法是隐藏所有评论，除​​了少数几个，然后在评论部分的底部做一​​个链接说＆＃34;更多评论（总计）＆＃34;。当用户点击更多评论时，它将显示其余的ng-repeat项目。

到目前为止，我已经能够通过简单地说ng-show =＆＃34; $ index＆lt;来隐藏其余的评论。 3＆＃34;但是，在用户点击“更多评论”之后，我还没有想出更多显示方式。我被困在如何在多个参数上进行ng-show。我原本以为我可以使用ng-click将变量设置为true，然后将其用作ng-show的第二个参数，但这似乎不起作用。

<ul>
  <li ng-repeat="comment in comments" ng-show="$index < 3 || showMore"> {{ comment }}</li>
</ul>
<a ng-click="showMore">More Comments(25)</a>

Answer 1

它似乎对我很好

https://jsfiddle.net/hqqpj9xw/

虽然使用您当前的技术，您不必将所有评论添加到dom并观看它们。更有效的解决方案是使用limitTo过滤器。

<div ng-app ng-init="comments = [1,2,3,4,5]">
    <div ng-repeat="item in comments | limitTo:showMore ? comments.length : 3">
        comment
    </div>
    <button ng-click="showMore = true">show more</button>
</div>

https://jsfiddle.net/zrw6dfgc/1/