javascript - 如何在我的案例中设置 Angular/Bootstrap UI？

Question

我在为我的应用设置 Angular/bootstrap 时遇到问题

我正在关注此页面的分页介绍。

http://angular-ui.github.io/bootstrap/

我的 app.js

angular.module('myApp', ['ngRoute','ui.bootstrap']).
    config(['$routeProvider', function($routeProvider) {
       ….
}]);

Controller .js

angular.module('myApp', ['ngRoute']).
controller('PaginationCtrl',['$scope', function ($scope) {
  $scope.totalItems = 64;
  $scope.currentPage = 4;
  $scope.maxSize = 5;

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

  $scope.bigTotalItems = 175;
  $scope.bigCurrentPage = 1;
}])

html

 <div id='pagination-wrapper' ng-controller='PaginationCtrl'>

 <pagination direction-links="false" total-items="totalItems" page="currentPage" num-pages="smallnumPages"></pagination>

</div>

我加载页面时没有错误，但我似乎看不到分页功能。谁能帮我解决这个问题？非常感谢!

Answer 1

问题似乎出在重新声明依赖关系上。如果您从 controller.js 模块中删除 ngRoute 依赖项，它将起作用。您还可以删除未使用的示例变量。

angular.module('myApp').
    controller('PaginationCtrl',['$scope', function ($scope) {
        $scope.totalItems = 64;
        $scope.currentPage = 4;
}]);

一个工作示例:http://plnkr.co/edit/wpgoDrA2Z7pjXbgdNrM8?p=preview