無限滾動與AngleJS Spring MVC
[英]Infinity scroll with angularjs spring mvc
問題描述
該控制器返回發票清單（model.addAttribute（“ invoices”，invoiceService.getAllInvoices（user.getId（）））），然后重定向到發票jsp頁面（方法invoiceService.getAllInvoices（user.getId（）成功）。
@RequestMapping(value = { "/", "/get-all-invoices" }, method = RequestMethod.GET)
public String getAllInvoices(HttpServletRequest request, ModelMap model) {
User user = (User) request.getSession().getAttribute("user");
model.addAttribute("invoices", invoiceService.getAllInvoices(user.getId()));
model.addAttribute("title", "Invoices");
return "invoices";
}
然后，在發票的jsp頁面上將獲得發票清單。 但是，該頁面未加載前20張發票，並且loadmore功能不起作用。 感謝幫助！
<!DOCTYPE html> <html> <head> <script src="<c:url value="/resources/js/jquery-1.12.0.min.js" />" type="text/javascript"></script> <script src="<c:url value="/twitter.github.io/bootstrap/assets/css/bootstrap.css" />" type="text/css"></script> <script src="<c:url value="/twitter.github.io/bootstrap/assets/css/bootstrap-responsive.css" />" type="text/css"></script> <script src="<c:url value="/ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js" />" type="text/javascript"></script> <script src="<c:url value="/resources/js/app.js" />" type="text/javascript"></script> <meta charset=utf-8 /> <title>JS Bin</title> </head> <body ng-controller="InvoiceController"ng-app="app"> <table class="table"> <tr ng-repeat="invoice in invoices | limitTo:totalDisplayed"><td>{{invoice.name}}</td> </tr> </table> <btn class="btn" ng-click="loadMore()">Load more</btn> <script> var app = angular.module('app', []); app.controller('InvoiceController', function ($scope) { $scope.invoices = invoices; $scope.totalDisplayed = 20; $scope.loadMore = function () { $scope.totalDisplayed += 20; }; }); </script> </body> </html>
1 個解決方案
解決方案1
0 已采納 2016-03-10 05:46:39
角側正確，彈簧響應類型錯誤。
您正在返回String，AngularJS ng-repeat將僅迭代對象列表，但您將迭代String值。
這是錯誤的：
public String getAllInvoices（HttpServletRequest請求，ModelMap模型）{
User user = (User) request.getSession().getAttribute("user");
model.addAttribute("invoices", invoiceService.getAllInvoices(user.getId()));
model.addAttribute("title", "Invoices");
return "invoices";
}
應該是：
公共列表 getAllInvoices（HttpServletRequest請求，ModelMap模型）{
User user = (User) request.getSession().getAttribute("user");
return invoiceService.getAllInvoices(user.getId());
}
invoiceService.getAllInvoices（user.getId（））服務應返回發票對象列表。
AngularJS數據列表分頁/數據列表上的無限滾動？
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.