javascript - Angular controller not loading using OcLazyLoad and ngRoute - Stack Overflow

admin管理员组

文章数量:1315788

I have an app that which has a load of scripts loading initially and the list is growing as development goes on. I want to lazy load scripts which contain controllers as and when needed. I am using OcLazyLoad along with ngRoute for the routing option (i did try ui-route which actually had the same end result but was causing other app issues). The lazy load and routing is working fine, scripts and views are only loaded when needed, but the issue is the controller is not being loaded (Argument 'caseReviewController' is not) so it's as though the controller does not exist.

Here is a simple version of what I have in my app.js file...

var app = angular.module('dashboard', ['oc.lazyLoad', 'ngRoute', 'LocalStorageModule']);


        app.config(function ($ocLazyLoadProvider, $routeProvider, localStorageServiceProvider) {


                $ocLazyLoadProvider.config({
                        loadedModules: ['dashboard'], modules: [
                            {
                                name: 'caseReview',
                                files: ['js/controllers/case-review.js']
                            }
                        ]
                });


                $routeProvider

                        //other routes here...

                        .when('/case-review', {
                            templateUrl: 'views/case-review.html',
                            controller: 'caseReviewController',
                            resolve: {
                                loadModule: ['$ocLazyLoad', function ($ocLazyLoad) {
                                    return $ocLazyLoad.load('caseReview');
                                }]
                            }
                        })

});

In the seperate case-review.js file I have a simple controller

app.controller('caseReviewController', function($scope, localStorageService, $route){
    //do stuff
});

This controller is not being found or executed but the view and js file are being lazy loaded as expected. Any help would be great.

Thanks.

I have an app that which has a load of scripts loading initially and the list is growing as development goes on. I want to lazy load scripts which contain controllers as and when needed. I am using OcLazyLoad along with ngRoute for the routing option (i did try ui-route which actually had the same end result but was causing other app issues). The lazy load and routing is working fine, scripts and views are only loaded when needed, but the issue is the controller is not being loaded (Argument 'caseReviewController' is not) so it's as though the controller does not exist.

Here is a simple version of what I have in my app.js file...

var app = angular.module('dashboard', ['oc.lazyLoad', 'ngRoute', 'LocalStorageModule']);


        app.config(function ($ocLazyLoadProvider, $routeProvider, localStorageServiceProvider) {


                $ocLazyLoadProvider.config({
                        loadedModules: ['dashboard'], modules: [
                            {
                                name: 'caseReview',
                                files: ['js/controllers/case-review.js']
                            }
                        ]
                });


                $routeProvider

                        //other routes here...

                        .when('/case-review', {
                            templateUrl: 'views/case-review.html',
                            controller: 'caseReviewController',
                            resolve: {
                                loadModule: ['$ocLazyLoad', function ($ocLazyLoad) {
                                    return $ocLazyLoad.load('caseReview');
                                }]
                            }
                        })

});

In the seperate case-review.js file I have a simple controller

app.controller('caseReviewController', function($scope, localStorageService, $route){
    //do stuff
});

This controller is not being found or executed but the view and js file are being lazy loaded as expected. Any help would be great.

Thanks.

• javascript
• angularjs
• lazy-loading
• ngroute

Share Improve this question Follow asked Apr 6, 2015 at 9:26 dbachdbach 16333 silver badges1414 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 10

In your separate case-review.js, you must get the reference of app.

angular.module('dashboard').controller('caseReviewController', function($scope, localStorageService, $route){
    //do stuff
});

As you've mentioned it's in separate file, it may not know about the app variable. It's better to get the reference of the angular module in the separate file.

This must solve your issue.

本文标签： javascriptAngular controller not loading using OcLazyLoad and ngRouteStack Overflow