AngularJS:如何基于变量更改ng-repeat limitTo?

Ron*_*eva 15 javascript limit angularjs angularjs-ng-repeat

我想基于变量在Angular.js ng-repeat上显示不同的limitTo数字.

这是我的代码:

<input type="text" ng-model="search" ng-change="checkNewCard(search)"/>
<div ng-repeat="score in scores | filter:search | limitTo:6" ng-hide="search">
...
</div>
<div ng-repeat="score in scores | filter:search | limitTo:5" ng-hide="!search">
...
</div>
<div new-card name="search" ng-show="showNewCard"></div>
Run Code Online (Sandbox Code Playgroud)

并在控制器中:

$scope.showNewCard = false;
$scope.checkNewCard = function (search) {
if (search == "")
    $scope.showNewCard = false;
else {
    $scope.showNewCard = true;
    }
};
Run Code Online (Sandbox Code Playgroud)

我只能假设有一种更优雅的方式来改变limitTo基于搜索输入,我只是不知道该寻找什么.

您可以在http://happinesshunt.co上看到此代码的实现.

PS我是新来的,也是一般的新发展,所以如果问题没有得到正确的解答,请原谅我.

谢谢!

sp0*_*00m 35

这可能是第一个解决方案(因为它可以改进,例如通过隐藏/显示更多/更少的链接):

<div ng-repeat="score in scores | limitTo: limit">
...
</div>
<a href ng-click="incrementLimit()">more</a>
<a href ng-click="decrementLimit()">less</a>
Run Code Online (Sandbox Code Playgroud)

在你的控制器中:

var limitStep = 5;
$scope.limit = limitStep;
$scope.incrementLimit = function() {
    $scope.limit += limitStep;
};
$scope.decrementLimit = function() {
    $scope.limit -= limitStep;
};
Run Code Online (Sandbox Code Playgroud)