angularjs - How to load directive in ui-router using $ocLazyLoad -

i've seen similar questions no solution seems work me.

i'm trying lazy load directives in ui-router. idea template "<my-directive></my-directive>" , i'm using resolve load js directive.

looking around , reading documentation got far.

app.config(function($stateprovider, $urlrouterprovider) {      $urlrouterprovider.otherwise("/");       var lazydeferred = {};       $stateprovider.state('app',{         url: '/app/:id/:directive',         templateprovider: function() { return lazydeferred.promise; },         resolve: {             load: ['$oclazyload','$q','$http','$stateparams','$compile', function($oclazyload, $q, $http,$stateparams,$compile) {                 lazydeferred = $q.defer();                 return $oclazyload.load('/directives/calculator.js').then(function() {                     var template = "<"+$stateparams.directive+"></"+$stateparams.directive+">";                     return lazydeferred.resolve(template);                 });              }]         }      }); 

});

the js loaded correctly , directive's tag correctly added ng-view cannot see result. tried use compile it's not working either.

any idea? thanks

i've found solution.

1. config app as:

   app.config(function($compileprovider) { app.compileprovider = $compileprovider; });

2. define directive as

   app.compileprovider.directive('directivename',........)

i'm not happy because didn't see mentioning solution! comment?