错误:$ parse:通过角度引导使用分页时的语法

时间:2016-02-13 07:05:16

标签: javascript angularjs pagination angular-bootstrap

我在我的tpl页面上使用分页时遇到了麻烦。

使用分页时出现的问题是

enter image description here

网页上显示的输出是

enter image description here

我正在使用的节点和构建工具版本

enter image description here

用于显示tpl和控制器中使用的分页的代码是

      <uib-pagination total-items="totalItems" ng-model="currentPage" max-size="maxSize" items-per-page="itemsPerPage"  boundary-link-numbers="true"></uib-pagination>      

我也尝试过使用这种语法

        <pagination total-items="totalItems" ng-model="currentPage" items-per-page="itemsPerPage"></pagination>

但存在相同的错误和输出。

控制器代码

                    $scope.topicList = response;
                    console.log(response);
                    $scope.totalItems = $scope.topicList.length;
                    $scope.currentPage = 1;
                    $scope.itemsPerPage = 10;
                    $scope.maxSize = 5;

                    $scope.setPage = function(pageNo) {
                        $scope.currentPage = pageNo;
                    };

                    $scope.pageCount = function() {
                        return Math.ceil($scope.topicList.length / $scope.itemsPerPage);
                    };

                    $scope.$watch('currentPage + itemsPerPage', function() {
                        var begin = (($scope.currentPage - 1) * $scope.itemsPerPage), end = begin + $scope.itemsPerPage;
                        $scope.topicDetails = $scope.topicList.slice(begin, end);
                    });

Bower.json文件

  "dependencies": {
    "bootstrap": "~3.3.2",
    "angular": "~1.5.0",
    "angular-bootstrap": "~0.14.0",
    "angular-ui-router": "~0.2.15",
    "jquery": "~2.1.4",
    "jquery-ui": "~1.11",
    "fontawesome": "~4.3.0",
    "angular-dragdrop": "1.0.8",
    "angular-pretty-checkable": "~0.1.7",
    "angular-animate": "~1.4.0",
    "angular-resource": "~1.4.0",
    "angular-cookies": "~1.4.0",
    "angular-sanitize": "~1.4.0",
    "angular-translate": "~2.7.0",
    "angular-dynamic-locale": "0.1.27",
    "angular-translate-loader-static-files": "2.7.2",
    "angular-i18n": "~1.4.0",
    "requirejs": "2.1.16",
    "requirejs-text": "2.0.13",
    "require-css": "0.1.8",
    "requirejs-domready": "~2.0.1"
  },
  "devDependencies": {
    "angular-mocks": "~1.4.0",
    "angular-scenario": "~1.4.0"
  },
  "resolutions": {
    "angular": "~1.x"
  }

Package.json文件有

{   name="dummy"
  "dependencies": {},
  "devDependencies": {
    "bower": "1.3.5",
    "chalk": "^0.5.1",
    "dateformat": "^1.0.11",
    "del": "^1.1.1",
    "event-stream": "3.1.5",
    "gulp": "^3.9.0",
    "gulp-autoprefixer": "0.0.7",
    "gulp-bower": "0.0.10",
    "gulp-browserify": "0.5.1",
    "gulp-compass": "1.1.8",
    "gulp-connect": "2.0.4",
    "gulp-flatten": "0.0.2",
    "gulp-imagemin": "0.5.0",
    "gulp-jshint": "1.5.5",
    "gulp-karma": "0.0.4",
    "gulp-livereload": "3.5.0",
    "gulp-load-utils": "0.0.4",
    "gulp-minify-css": "0.3.3",
    "gulp-minify-html": "0.1.3",
    "gulp-ng-annotate": "0.3.0",
    "gulp-ng-constant": "^0.3.0",
    "gulp-rename": "1.2.2",
    "gulp-replace": "0.2.0",
    "gulp-rev": "0.3.2",
    "gulp-ruby-sass": "1.0.0-alpha.2",
    "gulp-sass": "^2.1.1",
    "gulp-uglify": "0.2.1",
    "gulp-usemin": "0.3.1",
    "gulp-util": "^3.0.3",
    "gulp-watch": "^4.1.0",
    "jshint-stylish": "~2.0.1",
    "karma": "0.12.16",
    "karma-chrome-launcher": "0.1.4",
    "karma-html2js-preprocessor": "0.1.0",
    "karma-jasmine": "0.2.2",
    "karma-phantomjs-launcher": "0.1.4",
    "karma-requirejs": "0.2.2",
    "karma-script-launcher": "0.1.0",
    "lodash": "2.4.1",
    "minimist": "^1.1.0",
    "multipipe": "^0.1.2",
    "proxy-middleware": "0.5.0",
    "vinyl-paths": "^1.0.0",
    "zeparser": "0.0.7"
  },
  "engines": {
    "node": ">=0.10.0"
  }
}

我正在使用的Angular版本在bower.json文件中指定

请为此提供解决方案。

1 个答案:

答案 0 :(得分:0)

问题仍然存在因为:: operator in expression是在angularjs 1.3版本中引入的,而我已经升级了bower.json中的版本,但仍然以angular为单位显示的版本是1.27.2所以我删除了lib / bower_components文件夹重新安装依赖项,最后它现在工作。