Infinity scroll with angularjs spring mvc
Question
This controller return list of invoices(model.addAttribute("invoices", invoiceService.getAllInvoices(user.getId()))) then redirect to invoices jsp page (Method invoiceService.getAllInvoices(user.getId()) is success).
@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";
}
Then, in invoices jsp page will get list of invoices. However, The page isn't load the first 20 invoices, and loadmore function isn't working. Thanks for help!
<!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 answers
solution1
0 ACCPTED 2016-03-10 05:46:39
Angular side its correct, wrong in spring response type.
You are returning String, AngularJS ng-repeat will iterate list of objects only but You iterating String value.
This is wrong:
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";
}
This should be:
public List getAllInvoices(HttpServletRequest request, ModelMap model) {
User user = (User) request.getSession().getAttribute("user");
return invoiceService.getAllInvoices(user.getId());
}
invoiceService.getAllInvoices(user.getId()) service should return list of invoices objects.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.