通过$stateProvider使用ocLazyLoad延迟加载控制器
我在$stateProvider中使用oclazyload时遇到了问题。
我已经指定了控制器控制器应该加载到路由器配置中，它确实加载了，但在templateURL加载的文件中它不能用作ng- .js属性。
ui-route配置：
core
.run(
[ '$rootScope', '$state', '$stateParams',
function ($rootScope, $state, $stateParams) {
$rootScope.$state = $state;
$rootScope.$stateParams = $stateParams;
}
]
)
.config(
[ '$stateProvider', '$urlRouterProvider',
function ($stateProvider, $urlRouterProvider) {
console.info('Routing ...');
$urlRouterProvider
.otherwise('/app/dashboard');
$stateProvider
.state('app', {
abstract: true,
url: '/app',
templateUrl: 'templates/app.html',
})
.state('app.orders', {
abstract: true,
url: '/orders',
templateUrl: 'templates/orders/orders.html',
})
.state('app.orders.index', {
url: '/index',
templateUrl: 'templates/orders/index.html',
resolve: {
deps: ['$ocLazyLoad',
function( $ocLazyLoad ){
console.info('Path ot order controller in route config',Momento.paths.js + 'controllers/orders/index.js');
return $ocLazyLoad.load([
Momento.paths.js + 'controllers/orders/index.js'
])
}
]
}
})
}
]
)
;然后我的templateURL文件开始：
<div class="" id="" ng-controller="OrdersIndexController">...</div>但是当它加载时，console抛出错误：
<info>orders/index controller loaded controllers/orders/index.js:3
<info>Now I've finished loading the controller/order/index.js config/ui-router.js:69
<info>orders template loaded VM30437:1 (<-- this is the app.orders abstract template with ui-view directive ready for app.orders.index view)
<error>Error: [ng:areq] Argument 'OrdersIndexController' is not a function, got undefined
... <trace>那么，这个文件是由lazyload正确加载的，上面的控制台输出和开发人员工具中的网络选项卡都确认了这一点，但它在templateURL中不能用作控制器？是否需要在路由器配置中使用controller:'‘键或在模板中对其进行别名？是否需要专门附加到此应用程序中的(仅)模块？
我遗漏了什么？
PS:确认控制器的名称实际上是OrdersIndexController：
core
.controller('OrdersIndexController', [
'Model', '$scope', '$window',
function( Model, $scope, $window){
console.info("OrdersIndexController fired");
}
]);回答 3
Stack Overflow用户
发布于 2014-11-05 00:35:04
在函数function($ocLazyLoad){}中，您必须声明包含控制器的模块名称和"to lazy load“文件的名称。
function( $ocLazyLoad ){
return $ocLazyLoad.load(
{
name: 'module.name',
files: ['files']
}
);
}Stack Overflow用户
发布于 2016-03-09 21:34:23
您必须将您的控制器注册到
angular.module("myApp").controller
Working
angular.module("myApp").controller('HomePageController', ['$scope', function ($scope) {
console.log("HomePageController loaded");
}]);不工作
var myApp = angular.module("myApp")
myApp.controller('HomePageController', ['$scope', function ($scope) {
console.log("HomePageController loaded");
}]);Stack Overflow用户
发布于 2015-10-30 23:12:13
如果您对ocLazyLoad 1.0 -> With your router使用当前文档化的方式
...
resolve: { // Any property in resolve should return a promise and is executed before the view is loaded
loadMyCtrl: ['$ocLazyLoad', function($ocLazyLoad) {
// you can lazy load files for an existing module
return $ocLazyLoad.load('js/AppCtrl.js');
}]}
然后在js/AppCtrl.js中
你有类似这样的东西：
angular.module("myApp").controller('DynamicNew1Ctrl', ['$scope', function($scope) {
$scope.name = "Scoped variable";
console.log("Controller Initialized");
}]);请注意，使用angular.module("myApp")可以将新控制器附加到现有模块，在本例中是mainApp，因此任何新的动态控制器都可以使用应用程序依赖项。但是你可以定义一个新的模块并注入你的依赖项，如here所述，当你用插件架构构建你的应用程序，并且你想隔离动态模块时，通常会用到后者，这样它们就只能访问一些特定的依赖项
https://stackoverflow.com/questions/26681160
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号