[英]AngularJS: How to change ng-repeat limitTo based on variable?
我想基于变量在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>
并在控制器中:
$scope.showNewCard = false;
$scope.checkNewCard = function (search) {
if (search == "")
$scope.showNewCard = false;
else {
$scope.showNewCard = true;
}
};
我只能假设有一种更优雅的方式来改变limitTo基于搜索输入,我只是不知道该寻找什么。
您可以在http://happinesshunt.co上看到此代码的实现。
PS我是新来的,也是一般的新发展,所以如果问题没有得到正确的解答,请原谅我。
谢谢!
这可能是第一个解决方案(因为它可以改进,例如通过隐藏/显示更多/更少的链接):
<div ng-repeat="score in scores | limitTo: limit">
...
</div>
<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;
};
在ng-click中放置一个函数是一个很好的程序,但是我们也可以在这里直接递增一个例子。
<input type="text" ng-model="lmt"/><!--model with text box-->
<button ng-click="lmt=lmt+1">INCREMENT</button><!--model with INCREMENT btn-->
<button ng-click="lmt=lmt-1">DECREMENT</button><!-- with DECREMENT btn-->
<select ng-model="lmt"><!--select options also-->
<option>20</option>
<option>50</option>
<option>100</option>
</select>
<table>
<tr ng-repeat="employee in employData|limitTo: lmt"><!--lmt is the variable-->
<td>{{employee.regNo}}</td>
<td>{{employee.name}}</td>
<!-----other------>
</tr>
</table>
在控制器中,
$scope.lmt=20; /or something
$scope.employeeData={something............};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.