I have a kind of plugin architecture where I want to be able to upload JS-files with modules and load all those in my app.

I have this function in my app:

app.run(function loadPlugins($http, $ocLazyLoad) {
return $http.get('api/plugins').then(function (response) {
$ocLazyLoad.load(response.data);
});
});

A typical (and minimal) plugin could be:

angular.module('app.plugin.foo', []).config(function ($stateProvider) {
$stateProvider.state('app.secure.foo', {
url: '/foo',
template: '

Foo

Bar

'
});
});

This works fine as long as I'm in the app and navigate to /foo. But if I go to /foo from outside my app or when I'm on the page /foo and press F5, it doesn't work. I guess the URL is resolved before the $ocLazyLoad magic.

The app doesn't know about the dynamically loaded states. I need to do all lazy loading before the URL is resolved. Is this possible?