我正在使用Angular Bootstrap UI的分页指令的相当简单的实现,但我一直得到一个我无法弄清楚的错误.这是相关的片段:
以下是控制器中$ scope的相关部分:
// Set watch on pagination numbers $scope.$watch('currentPage + numPerPage', function() { var begin = (($scope.currentPage - 1) * $scope.numPerPage); var end = begin + $scope.numPerPage; $scope.filteredIdeas = $scope.ideasData.slice(begin, end); }); // Data $scope.ideasData = []; for (var i = 0; i < 100; i++) { $scope.ideasData.push('To do ' + i); } $scope.filteredIdeas = []; $scope.currentPage = 1; $scope.numPerPage = 10; $scope.totalIdeas = $scope.ideasData.length;
分页设置正确,但这是我在尝试点击下一页(或任何页面)时收到的错误:
Error: [$compile:nonassign] Expression 'undefined' used with directive 'pagination' is non-assignable!
如果我理解正确,这表明我正在使用不正确的双向绑定?能够复制这个Plunkr中的错误:http://plnkr.co/edit/uyWQXPqjLiE4qmQLHkFy
任何人都对我做错了什么有任何想法?
如更改日志中所述,ng-model
引入了使用能力:ui-bootstrap-tpls-0.11.0.js
无论
pagination
和pager
现在集成ngModelController
.
*page
替换为ng-model
*on-select-page
被删除,因为ng-change
现在可以使用
之前:
<pagination page="current" on-select-page="changed(page)" ...></pagination>
之后:
<pagination ng-model="current" ng-change="changed()" ...></pagination>
由于您正在使用ui-bootstrap-tpls-0.10.0.min.js
,您需要使用旧语法 - page
而不是ng-model
:
<pagination page="currentPage" total-items="totalIdeas"></pagination>