Kendo UI loading individual scripts using ocLazyLoad
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");
})
}]
}
})