Discussions

Hi, First, thank a lot for your good job. I have an issue with ocLazyLoading.load and modules dependencies. the code: file1.js : angular.module('mod1', [ {files:[ 'file2', 'file3'] } ]) .controller('mod1Ctrl', ['$scope', 'mod3Svc', function($scope, mod3Svc){ ... }) .factory('mod1Svc', ['mod3Svc', function(mod3Svc){ return { func1: function{ return mod3Svc.func1() } } }); file2.js : angular.module('mod2', [ {files:[ 'file3', 'file4'] } ]); file3.js : angular.module('mod3', [ ]) .factory('mod3Svc', function(){ return { func1: function(){ return true} }; }); file4.js : angular.module('mod4', [ ]); app.js : (loaded with page) angular.module('app', [ 'oc.lazyLoad', 'ui.router' ]) .config(['$stateProvider', '$ocLazyLoadProvider', function($stateProvider, $ocLazyLoadProvider){ $ocLazyLoadProvider.config({ debug: true, modules: [{ name: 'ocMod1', files: ['file1.js'] }] }); $stateProvider .state('state1', { url: '/state1', templateUrl: 'state1.html', controller: 'mod1Ctrl', resolve: { myResolve: ['$stateParams', '$ocLazyLoad', '$injector', '$log', function ($stateParams, $ocLazyLoad, $injector, $log) { return $ocLazyLoad.load('mod1').then(function () { $log.debug("$ocLazyLoad.load('mod1').then RESOLVE"); var service = $injector.get('mod1Svc'); return service.func1(); }); }] } }) }]); the issue : In some situation, not everytime, $ocLazyLoad.load(['mod1']) resolve before file3.js was loaded. Best regards, Patrice Pechereau (I am french (85))

What if I call $ocLazyLoad.load('myFile.js') again? I see in the network tab it does not load that module again which is what I want but I want to know what exactly is happening?

I have used oclazyload with ui-router. For build process, we have minified the controller files and using grunt filerev, we have changed the name of files. We need to update those file names in router file with grunt usemin. Can you tell me how we should do that?

When I add oc.lazyLoad into my module, it fails with the below message. http://errors.angularjs.org/1.3.15/$injector/modulerr?p0=esApp&p1=%5B%24injector%3Amodulerr%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.3.15%2F%24injector%2Fmodulerr%3Fp0%3Doc.lazyLoad%26p1%3D%255B%2524injector%253Anomod%255D%2520http%253A%252F%252Ferrors.angularjs.org%252F1.3.15%252F%2524injector%252Fnomod%253Fp0%253Dangular-momentjs%250Ahttp%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A6%253A422%250Ahttp%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A21%253A427%250Aa%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A21%253A54%250Ahttp%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A21%253A311%250Amodule%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Foclazyload%252Fdist%252FocLazyLoad.min.js%253A8%253A12216%250Au%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Foclazyload%252Fdist%252FocLazyLoad.min.js%253A8%253A3377%250Ahttp%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Foclazyload%252Fdist%252FocLazyLoad.min.js%253A8%253A3495%250Ar%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A7%253A306%250Au%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Foclazyload%252Fdist%252FocLazyLoad.min.js%253A8%253A3479%250Ahttp%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Foclazyload%252Fdist%252FocLazyLoad.min.js%253A8%253A3978%250Ae%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A36%253A320%250Ainstantiate%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A36%253A433%250Ad%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A34%253A167%250Ahttp%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A34%253A99%250Ad%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A34%253A503%250Ahttp%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A35%253A100%250Ar%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A7%253A306%250Ag%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A34%253A400%250Ahttp%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A35%253A64%250Ar%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A7%253A306%250Ag%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A34%253A400%250Aab%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A38%253A136%250Ad%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A17%253A383%250Auc%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A18%253A180%250AJd%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A17%253A2%250Ahttp%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fangular%252Fangular.min.js%253A250%253A431%250Aj%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fjquery%252Fdist%252Fjquery.min.js%253A2%253A27194%250AfireWith%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fjquery%252Fdist%252Fjquery.min.js%253A2%253A54761%250Aready%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fjquery%252Fdist%252Fjquery.min.js%253A2%253A29807%250AI%2540http%253A%252F%252Flocalhost%253A8080%252Fresources%252Fcomponents%252Fjquery%252Fdist%252Fjquery.min.js%253A2%253A29992%0Ahttp%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fangular%2Fangular.min.js%3A6%3A422%0Ahttp%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fangular%2Fangular.min.js%3A35%3A322%0Ar%40http%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fangular%2Fangular.min.js%3A7%3A306%0Ag%40http%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fangular%2Fangular.min.js%3A34%3A400%0Ahttp%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fangular%2Fangular.min.js%3A35%3A64%0Ar%40http%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fangular%2Fangular.min.js%3A7%3A306%0Ag%40http%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fangular%2Fangular.min.js%3A34%3A400%0Aab%40http%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fangular%2Fangular.min.js%3A38%3A136%0Ad%40http%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fangular%2Fangular.min.js%3A17%3A383%0Auc%40http%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fangular%2Fangular.min.js%3A18%3A180%0AJd%40http%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fangular%2Fangular.min.js%3A17%3A2%0Ahttp%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fangular%2Fangular.min.js%3A250%3A431%0Aj%40http%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fjquery%2Fdist%2Fjquery.min.js%3A2%3A27194%0AfireWith%40http%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fjquery%2Fdist%2Fjquery.min.js%3A2%3A54761%0Aready%40http%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fjquery%2Fdist%2Fjquery.min.js%3A2%3A29807%0AI%40http%3A%2F%2Flocalhost%3A8080%2Fresources%2Fcomponents%2Fjquery%2Fdist%2Fjquery.min.js%3A2%3A29992 Does anyone know why it fails? (function(){ angular.module("esApp", ["ui.bootstrap", "ui.router", "ngCookies","angularBootstrapNavTree",'ui.grid','ui.grid.pagination','ui.grid.selection','ui.utils.masks','uiGmapgoogle-maps','ngSanitize',"oc.lazyLoad"]); angular.module("esApp").config(["$stateProvider", "$urlRouterProvider","$locationProvider", function($stateProvider, $urlRouterProvider,$locationProvider) { $locationProvider.hashPrefix('!'); $urlRouterProvider.otherwise("/"), $stateProvider.state("index", { url: "/", templateUrl: "/resources/views/dashboard/dashboard.html" }).state("tables", { url: "/tables", templateUrl: "views/tables.html" }).state("code", { url: "/code", templateUrl: "/resources/views/code/code.html", controller:"CodeController" }).state("hotel", { url: "/hotel", templateUrl: "/resources/views/hotel/hotel.html", data:{pageTitle:"Hotel Management"}, controller:"HotelController" } ).state("restaurant", { url: "/restaurant", templateUrl: "/resources/views/restaurants/restaurant.html", controller:"RestaurantController" }) }]); angular.module("esApp").config(function(uiGmapGoogleMapApiProvider){ uiGmapGoogleMapApiProvider.configure({ key: 'AIzaSyBoJ3pCQU1ibtAxkjTgZJYQlr6SKsI0U-0', v: '3', libraries: 'weather,place,geometry,visualization' }); }); angular.module("esApp").config(function($logProvider){ $logProvider.debugEnabled(true); }); }());

I'm switching to the old latest ocLazyLoad, its absolutely awesome apart form one thing. There used to be a flag: 'rerun' which used to execute run block upon module reload. My project depends on it quite a lot, has this been removed in latest version? because it no longer works

What happened to requirejs support?

I´m developing an application in asp.net mvc with angularjs and I need to lazy load some of my controllers, directives, services and so on. I´ve searched deeply on web and I found this js library to work with. so let see how my code are: 1 - LayoutPage (ASP.NET MVC) <html> <head> </head> <body ng-app="myAppUAI"> /*all my imports scripts are at the bottom of the page*/ <script type="text/javascript" src="..."></script> </body> </html> 2 - app.js var MyApp = angular.module("myAppUAI", ["ngProgress", "ngMaterial", "ngRoute", "oc.lazyLoad"]); MyApp.config(["$routeProvider", "$ocLazyLoadProvider" , function ($routeProvider, $ocLazyLoadProvider) { $routeProvider .when("/", { templateUrl: "/Main/Index", controller: "progressCircularController", resolve: { home: function ($ocLazyLoad) { return $ocLazyLoad.load(["/Scripts/AngularJS/Controllers/progressCircularController.js"]); } } }) .otherwise({ redirectTo: "/" }); $ocLazyLoadProvider.config({ debug: true, events: true }); }]); 3 - progressCircularController.js angular.module("myAppUAI").controller("progressCircularController", ["$rootScope", "$scope", function ($rootScope, $scope) { $scope.key = "Marcelo Bertinatto D´ Onofrio"; }]); 4 - in my view <div ng-controller="progressCircularController"> {{key}} </div> And finally, I´m getting a error in console like this: http://errors.angularjs.org/1.6.2/$controller/ctrlreg?p0=progressCircularController ocLazyLoad.fileLoaded scripts/AngularJS/Controllers/progressCircularController.js angular.js:14362 ocLazyLoad.componentLoaded ["myAppUAI", "register", "progressCircularController"] angular.js:14362 ocLazyLoad.moduleReloaded myAppUAI I've exhausted all my possibilities. Can you tell me what I´m doing wrong? Thanks in advance.

Hello; I want to use oclazyload in my project. I am using ui-router also. In debug mode, I see the message "ocLazyLoad.fileLoaded js/controllers/XXXController.js" but after that, I am getting error. Configuration is like below: .state('shops.menus.entities', { url: "/:menuid/entities", views: { 'content@': { templateUrl: "views/wizard.html", controller: "WizardController" } } data: { pageTitle: 'Menu Wizard', roles: ['user'] }, resolve: { // Any property in resolve should return a promise and is executed before the view is loaded loadMyCtrl: ['$ocLazyLoad', function($ocLazyLoad) { return $ocLazyLoad.load([ 'js/controllers/WizardController.js', ]); }], }, menuTreeObject: function($stateParams, EntityService, ShopService) { return EntityService.getMenuTree($stateParams.menuid, function() { }, function() { }); } }) Thank you.

I have load several files with ocLazyLoad and it logs out that the second load before the first one and it cannot find the defined module. here are my lazy load code ```javascript resolve: { deps: ['$ocLazyLoad', function($ocLazyLoad) { return $ocLazyLoad.load({ name: 'PSS_AdminApp', insertBefore: '#ng_load_plugins_before', files: [ 'assets/global/scripts/datatable.js', 'assets/global/plugins/datatables/datatables.min.js', 'assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.js', ] }); }] } ```

Are there any examples of handling file not found errors in resolve? I'd like to be able to catch these and return an error handler module. Thx,