Kendo UI loading individual scripts using ocLazyLoad

[rajguru827]

I am trying load individual scripts of kendo UI based on usage. The files are loading fine if I will refresh the page while state changing kendo directives are not working. My Code:

config(['$ocLazyLoadProvider', function ($ocLazyLoadProvider) { $ocLazyLoadProvider.config({ debug: true, events: false, serie: true, modules: [ { name: "kendo.list.view", insertBefore: "#load_after_jquery", files: [ "assets/vendor/kendoUi/js/kendo.core.min.js", "assets/vendor/kendoUi/js/kendo.angular.min.js", "assets/vendor/kendoUi/js/kendo.data.min.js", "assets/vendor/kendoUi/js/kendo.listview.min.js", ], serie: true, }, { name: "channels", insertBefore: "#load_after_jquery", files: [ "assets/vendor/kendoUi/js/kendo.core.min.js", "assets/vendor/kendoUi/js/kendo.angular.min.js", "assets/vendor/kendoUi/js/kendo.data.min.js", "assets/vendor/kendoUi/js/kendo.popup.min.js", "assets/vendor/kendoUi/js/kendo.list.min.js", "assets/vendor/kendoUi/js/kendo.fx.min.js", "assets/vendor/kendoUi/js/kendo.userevents.min.js", "assets/vendor/kendoUi/js/kendo.draganddrop.min.js", "assets/vendor/kendoUi/js/kendo.mobile.scroller.min.js", "assets/vendor/kendoUi/js/kendo.dropdownlist.min.js", "assets/vendor/kendoUi/js/kendo.multiselect.min.js" ], serie: true, }, { name: "jobs", insertBefore: "#load_after_jquery", files: [ "assets/vendor/kendoUi/js/kendo.core.min.js", "assets/vendor/kendoUi/js/kendo.angular.min.js", "assets/vendor/kendoUi/js/kendo.data.min.js", "assets/vendor/kendoUi/js/kendo.listview.min.js", "assets/vendor/kendoUi/js/kendo.popup.min.js", "assets/vendor/kendoUi/js/kendo.list.min.js", "assets/vendor/kendoUi/js/kendo.fx.min.js", "assets/vendor/kendoUi/js/kendo.userevents.min.js", "assets/vendor/kendoUi/js/kendo.draganddrop.min.js", "assets/vendor/kendoUi/js/kendo.mobile.scroller.min.js", "assets/vendor/kendoUi/js/kendo.dropdownlist.min.js", "assets/vendor/kendoUi/js/kendo.calendar.min.js", "assets/vendor/kendoUi/js/kendo.datepicker.min.js" ], serie: true, }] }); }]);

//route for addresses .state('app.addresses', { url: '/addresses', templateUrl: 'app/pages/addresses.aspx', controller: 'addressesController', data: { pageTitle: 'Addresses' }, resolve: { loadMyCtrl: ['$ocLazyLoad', function ($ocLazyLoad) { return $ocLazyLoad.load([{ insertBefore: "#load_styles_before", files: ["assets/vendor/checkbo/css/checkBo.css" + appendVersion] }, { reconfig: true, files: ["assets/vendor/checkbo/js/checkBo.min.js" + appendVersion, "app/components/addresses/addressesController.js" + appendVersion] }]).then(function () { return $ocLazyLoad.load("kendo.list.view"); }) }]
} }) //route for channels .state('app.channels', { url: '/channels', templateUrl: 'app/pages/channels.aspx', controller: 'channelsController', data: { pageTitle: 'Channels' }, resolve: { loadMyCtrl: ['$ocLazyLoad', function ($ocLazyLoad) { return $ocLazyLoad.load([{ insertBefore: "#load_styles_before", serie: true, files: ["assets/vendor/checkbo/css/checkBo.css" + appendVersion, "assets/vendor/sweetAlert/sweetalert.css"+ appendVersion] }, { serie: true, files: ["assets/vendor/checkbo/js/checkBo.min.js" + appendVersion, "assets/vendor/sweetAlert/sweetalert.min.js" + appendVersion, "assets/vendor/angular/js/SweetAlert.min.js" + appendVersion, 'https://appcenter.intuit.com/Content/IA/intuit.ipp.anywhere-1.3.3.js', "app/components/channels/channelsController.js" + appendVersion] }]).then(function () { return $ocLazyLoad.load("channels"); }) }] } })