在Angular.js中創建'More posts ...'按鈕

我目前正在嘗試爲我的Angular.js應用創建'顯示帖子'按鈕。我無法通過外部腳本動態設置limitTo。到目前爲止，我有：在Angular.js中創建'More posts ...'按鈕

<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:feedLimit在視圖中的內嵌部分取代limitTo:5。

我已經設置了Plunker與基本設置至今這裏：http://plnkr.co/edit/OFqkGFKVUHKi2A20c4t3

任何幫助將是巨大的！

感謝，

來源

2013-05-01 JohnRobertPett

好像你在正確的軌道上，但你只需要定義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; 
    // ... 
});

來源

2013-05-01 14:15:22 Langdon

尼斯一個，謝謝！ – JohnRobertPett 2013-05-01 14:18:47

你已經打敗了我幾秒鐘。我只是添加我不確定feedLoader是必需的。可以這樣做：'feed in feed | limitTo：feedLimit' – lucuma 2013-05-01 14:21:32

在Angular.js中創建'More posts ...'按鈕

回答

相關問題