AngularJS:如何根据变量更改 ng-repeat limitTo? [英] AngularJS: How to change ng-repeat limitTo based on variable?

问题描述

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

这是我的代码:

<div ng-repeat="score in score | filter:search | limitTo:6" ng-hide="search">...

<div ng-repeat="score in score | filter:search | limitTo:5" ng-hide="!search">...

<div new-card name="search" ng-show="showNewCard"></div>

在控制器中:

$scope.showNewCard = false;$scope.checkNewCard = 函数(搜索){如果(搜索==")$scope.showNewCard = false;别的 {$scope.showNewCard = true;}};

我只能假设有一种更优雅的方式可以根据搜索输入更改 limitTo，我只是不知道要查找什么.

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

附言我是新来的，一般来说也是开发新手，所以如果问题没有正确提出，请原谅我.

先谢谢了！

解决方案

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

...
<a href ng-click="incrementLimit()">more</a><a href ng-click="decrementLimit()">less</a>

在您的控制器中:

var limitStep = 5;$scope.limit = limitStep;$scope.incrementLimit = function() {$scope.limit += limitStep;};$scope.decrementLimit = function() {$scope.limit -= limitStep;};

I would like to show a different limitTo number on Angular.js ng-repeat, based on a variable.

Here is my code:

<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>

and in the controller:

$scope.showNewCard = false;
$scope.checkNewCard = function (search) {
if (search == "")
    $scope.showNewCard = false;
else {
    $scope.showNewCard = true;
    }
};

I can only assume there is a more elegant way of changing the limitTo based on the search input, I just have no idea what to look for.

You can see the implementation of this code on http://happinesshunt.co.

P.S. I'm new here and new to development in general, so please forgive me if the question wasn't asked properly.

Thanks ahead!

解决方案

Here could be a first solution (since it can be improved, e.g. by hiding/displaying the more/less links):

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

In your controller:

var limitStep = 5;
$scope.limit = limitStep;
$scope.incrementLimit = function() {
    $scope.limit += limitStep;
};
$scope.decrementLimit = function() {
    $scope.limit -= limitStep;
};

这篇关于AngularJS:如何根据变量更改 ng-repeat limitTo?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！