Javascript 如何从控制器以不同的方式加载ui.bootstrap模块？

我有以下项目配置：

var app = angular.module('myApp', []);

app.config(['$routeProvider', function($routeProvider) {
                $routeProvider.when('/aaa',
                   {templateUrl: config.base_url + 'app/partials/aaa/index.html',
                    controller: 'AAACtrl'});
                $routeProvider.when('/bbb', 
                   {templateUrl: config.base_url + 'app/partials/bbb/index.html', 
                    controller: 'BBBCtrl'});
                $routeProvider.when('/ccc', 
                   {templateUrl: config.base_url + 'app/ccc/reportsView.html', 
                    controller: 'reportCtrl'});
                            }]);

您可以看到，我没有加载

ui.bootstrap

模块

reportCtrl

如下所示：

app.controller('reportCtrl',  
    ['$scope', function($scope) { /**/}

var app = angular.module('myApp', []);

app.config(['$routeProvider', function($routeProvider) {
                $routeProvider.when('/aaa',
                   {templateUrl: config.base_url + 'app/partials/aaa/index.html',
                    controller: 'AAACtrl'});
                $routeProvider.when('/bbb', 
                   {templateUrl: config.base_url + 'app/partials/bbb/index.html', 
                    controller: 'BBBCtrl'});                   
                }]);

根据这个演示，我想使用datepicker。但是，它需要将

ui.bootstrap

模块添加到

app

。但我不想添加到我的所有项目中（以防止冲突）。我感兴趣的是只在一个控制器中使用

ui.bootstrap

模块

我使用codeigniter，每个控制器使用自己的头

我怎样才能做到这一点

---

谢谢，

我想到的一件事是创建不同的模块和routeProvider。请注意，我们可以通过添加

myApp

来“扩展”父模块，以便使用服务/指令，请参阅

myApp

var appReport = angular.module('myAppReport', ['myApp','ui.bootstrap']);
//                                  ^^^          ^^^        
//                             new module     extends old one

  // we just split $routerProvider
  appReport.config(['$routeProvider', function($routeProvider) {
                $routeProvider.when('/ccc', 
               {templateUrl: config.base_url + 'app/ccc/reportsView.html', 
                controller: 'reportCtrl'});
                        }]);

因此，

myApp

看起来像：

app.controller('reportCtrl',  
    ['$scope', function($scope) { /**/}

var app = angular.module('myApp', []);

app.config(['$routeProvider', function($routeProvider) {
                $routeProvider.when('/aaa',
                   {templateUrl: config.base_url + 'app/partials/aaa/index.html',
                    controller: 'AAACtrl'});
                $routeProvider.when('/bbb', 
                   {templateUrl: config.base_url + 'app/partials/bbb/index.html', 
                    controller: 'BBBCtrl'});                   
                }]);

---

我想到的一件事是创建不同的模块和routeProvider。请注意，我们可以通过添加

myApp

来“扩展”父模块，以便使用服务/指令，请参阅

myApp

var appReport = angular.module('myAppReport', ['myApp','ui.bootstrap']);
//                                  ^^^          ^^^        
//                             new module     extends old one

  // we just split $routerProvider
  appReport.config(['$routeProvider', function($routeProvider) {
                $routeProvider.when('/ccc', 
               {templateUrl: config.base_url + 'app/ccc/reportsView.html', 
                controller: 'reportCtrl'});
                        }]);

因此，

myApp

看起来像：

app.controller('reportCtrl',  
    ['$scope', function($scope) { /**/}

var app = angular.module('myApp', []);

app.config(['$routeProvider', function($routeProvider) {
                $routeProvider.when('/aaa',
                   {templateUrl: config.base_url + 'app/partials/aaa/index.html',
                    controller: 'AAACtrl'});
                $routeProvider.when('/bbb', 
                   {templateUrl: config.base_url + 'app/partials/bbb/index.html', 
                    controller: 'BBBCtrl'});                   
                }]);

---

谢谢，是的，我曾考虑过新的routerProvider，但还是坚持使用共享工厂。谢谢：）谢谢，是的，我考虑过新的routerProvider，但还是坚持使用共享工厂。谢谢：）