删除JSON时如何更新分页列表

时间:2015-07-02 16:33:19

标签: javascript json angularjs pagination angular-ui-bootstrap

filteredTodos删除项目时,是否有任何简单的选项可以更新分页和todos 演示:http://codepen.io/anon/pen/gpveqL

var todos = angular.module('todos', ['ui.bootstrap']);
todos.controller('TodoController', function($scope) {
  $scope.filteredTodos = [];
  $scope.currentPage = 1;
  $scope.numPerPage = 10;
  $scope.maxSize = 5;
  $scope.makeTodos = function() {
  $scope.todos = [];
    for (i = 1; i <= 66; i++) {
      $scope.todos.push({id: i, text: 'todo ' + i, done: false});
    }
  };
  $scope.makeTodos();
  $scope.$watch('currentPage + numPerPage', function() {
    var begin = (($scope.currentPage - 1) * $scope.numPerPage),
      end = begin + $scope.numPerPage;
    $scope.filteredTodos = $scope.todos.slice(begin, end);
  });
  $scope.deleteMe = function (id) {
    $scope.todos.splice(0, 1);
  };
});
<pagination 
	ng-model="currentPage"
	total-items="todos.length" 
	max-size="maxSize" 
	boundary-links="true" 
	previous-text="&lsaquo;" 
	next-text="&rsaquo;" 
	first-text="&laquo;" 
	last-text="&raquo;"
></pagination>

0 个答案:

没有答案