ocombe / ocLazyLoad

Lazy load modules & components in AngularJS
https://oclazyload.readme.io
MIT License
2.63k stars 510 forks source link

ocLazyLoad and growl2 problem #301

Closed borgogelli closed 8 years ago

borgogelli commented 8 years ago

I'd like to use ocLazyLoad and the Growl2 module

app.config(['$ocLazyLoadProvider', function($ocLazyLoadProvider) {
    $ocLazyLoadProvider.config({
        modules: [{
            name: 'growl',
            files: [
                {type: 'css', path: '/bower_components/angular-growl-v2/build/angular-growl.css'},
                {type: 'js', path: '/bower_components/angular-growl-v2/build/angular-growl.js'}
            ]
        },
}]);

.....................

$ocLazyLoad.load('growl').then(function() {
        var growl = $injector.get('growl'); 
        growl.error('Show nothing !');
    });

Nothing happens, any advice ? Thank you in advance

Andrea

ocombe commented 8 years ago

Hello, according to the documentation, it requires that you include the directive in the dom as well. Since you lazy load growl, you will have to call $compile on the element of DOM that includes growl (<div growl></div>) so that angular binds the lazy loaded library to this part of dom. After that it should work.

borgogelli commented 8 years ago

Thank you very much for the advice Now It works.

     $ocLazyLoad.load("growl").then(function() {
         console.log('loaded!!');
         growl = $injector.get('growl');
         var el, elToAppend;
         elToAppend = $compile('<div growl></div>')($scope);
         el = angular.element('#growl');
         el.append(elToAppend);
     }, function(e) {
         console.log('errr');
         console.error(e);
     })

Greetings from Italy

Andrea