Client-side Aangularjs

Install:

bower install angular-paginate-anything  --save

Angularjs:
app.js

angular.module('myModule', ['bgf.paginateAnything']);

blog.controller.js
[js]
class BlogCtrl {
constructor(Auth, Blog, $state, $stateParams, $http, $scope, $location, socket) {
this.errors = {};
this.success = {};
this.submitted = false;
this.Auth = Auth;
this.Blog = Blog;
this.$state = $state;
this.$stateParams = $stateParams;
this.blogs = [];

$scope.url = '/api/blogs';
$scope.perPage = parseInt($location.search().perPage, 10) || 3;
$scope.page = parseInt($location.search().page, 10) || 0;
$scope.clientLimit = 250;

$scope.$watch('page', function(page) { $location.search('page', page); });
$scope.$watch('perPage', function(page) { $location.search('perPage', page); });
$scope.$on('$locationChangeSuccess', function() {
  var page = +$location.search().page,
    perPage = +$location.search().perPage;
  if(page >= 0) { $scope.page = page; };
  if(perPage >= 0) { $scope.perPage = perPage; };
});
$scope.urlParams = {
  status: 'active',
  page: $scope.page,
  perPage: $scope.perPage,
  clientLimit: $scope.clientLimit
};

$http.get('/api/blogs').then(response => {
    this.blogs = response.data;
    socket.syncUpdates('blog', this.blogs);
});

$scope.$on('$destroy', function() {
  socket.unsyncUpdates('blog');
});

$scope.$on('pagination:loadPage', function (event, status, config) {
  // config contains parameters of the page request
  console.log(config.url);
  // status is the HTTP status of the result
  console.log(status);
});

}
}

angular.module(‘myModule’)
.controller(‘BlogCtrl’, BlogCtrl);

[/js]

blog.html:
[html]


[/html]

Server-side Nodejs

Install:

npm install node-paginate-anything --save

blog.controller.js:
[js]
function respondWithResult(res, statusCode) {
statusCode = statusCode || 200;
return function(entity) {
if (entity) {
res.status(statusCode).json(entity);
}
};
}

function handleError(res, statusCode) {
statusCode = statusCode || 500;
return function(err) {
console.error(err);
res.status(statusCode).send(err);
};
}

// Gets a list of Blogs
export function index(req, res) {
var clientLimit = req.query.clientLimit;
Blog.countAsync()
.then(count => {
var totalItems = count;
var maxRangeSize = clientLimit;
var queryParams = paginate(req, res, totalItems, maxRangeSize);
console.log(count);
return Blog.where().limit(queryParams.limit).skip(queryParams.skip).findAsync()
})
.then(respondWithResult(res))
.catch(handleError(res));
}

[/js]

Leave a Reply