Question

我正在尝试为我的Angular.js应用制作一个'show posts'按钮。我在从外部脚本动态设置limitTo时遇到问题。到目前为止，我有：

<body ng-controller="FeedCtrl">
  <h1>Feeds</h1>
  <div ng-repeat="feed in (feedLoader = (feeds | limitTo:5))">
    <p>{{feed.content}}</p>
  </div>
  <button ng-click="showPosts()">Show more...</button>
</body>

我采取的方法是：

$scope.showMorePosts = function () {
  $scope.feedLoader = (feeds | limitTo:feedLimit);
}

...然后在视图的内嵌部分用limitTo:5替换limitTo:feedLimit。

到目前为止，我已经设置了一个基本设置的Plunker：http://plnkr.co/edit/OFqkGFKVUHKi2A20c4t3

任何帮助都会很棒！

谢谢，

JP

Answer 1

好像你在正确的轨道上，但你只需要定义showPosts（）：

$scope.showMore = function() {
    $scope.feedLimit += 1;
}

完整示例：

http://plnkr.co/edit/pE49Wt0rvDjWhsKD0WiD?p=preview

HTML

<div ng-repeat="feed in (feedLoader = (feeds | limitTo:feedLimit))">
  <p>{{feed.content}}</p>
</div>
<button ng-click="feedLimit = feedLimit + 1">Show more...</button>

JavaScript的：

app.controller('FeedCtrl', function($scope) {
    $scope.feedLimit = 3;
    // ...
});

在Angular.js中创建“更多帖子...”按钮

1 个答案: