问题描述
我正在使用angular-js，javscript和HTML。 我可以从数据库中获取客户名称及其详细信息的列表，但是我想在按下一步按钮时逐一显示这些记录。 你能建议我怎么做吗
提前致谢..
1楼
Anil Sharma
1
2015-07-31 07:19:02
您按下某个按钮，将触发某些事件，并且您将点击一些API，并且响应将显示在页面上。 如果是，让我们说按钮点击ShowData函数触发。
App.controller('CustomerCtrl',['$scope',function($scope){
$scope.ShowData = CustomerService.Names().then(function(data){
$scope.customers = data
})
}])
在HTML中
<div ng-controller="CustomerCtrl">
<div ng-repeat="customer in customers">
<h3 ng-bind="customer.name"></h3>
</div>
</div>
2楼
1
<div ng-controller="CustomerCtrl">
<button value="Next" ng-click="next()">
<div>
<h3>{{name}}</h3>
</div>
</div>
和你的js文件
App.controller('CustomerCtrl',['$scope',function($scope){
$scope.ShowData = CustomerService.Names().then(function(data){
$scope.customers = data;
})
var cnt=0;
$scope.next=function(){
$scope.name=$scope.customers[cnt].name;
cnt++;
}
}])
3楼
Muhsin
0
2015-07-31 16:26:11
您可以通过将ng-repeat与limitTo过滤器一起使用来解决上述问题。$ scope.customers包含JSON数组.limitTo也通过使用变量i控制。
function MyCtrl($scope) { $scope.i=1; $scope.customers = [{ "firstName": "John", "place":"USA", "number":"78437375" }, { "firstName": "Anna", "place":"Asia", "number":"546464656" }, { "firstName": "Peter", "place":"Europe", "number":"24353535" }]; $scope.showMoreCustomers=function() { $scope.i++; } $scope.showLessCustomers=function() { $scope.i--; } }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js"></script> <div ng-app ng-controller="MyCtrl"> <button ng-click="showMoreCustomers()">+</button> <button ng-click="showLessCustomers()">-</button> <ul> <li ng-repeat="cust in customers | limitTo:i">{{cust.firstName}},{{cust.place}},{{cust.number}}</li> </ul> </div>