Angular UI Bootstrap中的分页抛出"错误:[$ compile:nonassign]"

 熊孝琳_506 发布于 2023-01-17 21:11

我正在使用Angular Bootstrap UI的分页指令的相当简单的实现,但我一直得到一个我无法弄清楚的错误.这是相关的片段:

  • {{todo}}

以下是控制器中$ 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

任何人都对我做错了什么有任何想法?

1 个回答
  • 如更改日志中所述,ng-model引入了使用能力:ui-bootstrap-tpls-0.11.0.js

    无论paginationpager现在集成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>
    

    2023-01-17 21:18 回答
撰写答案
今天,你开发时遇到什么问题呢?
立即提问
热门标签
PHP1.CN | 中国最专业的PHP中文社区 | PNG素材下载 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有