How can directives be lazy loaded in angularjs?

后端 未结 4 1150
独厮守ぢ
独厮守ぢ 2020-12-30 01:58

I\'m working with angularjs and I want to be able to load directives as and when they are needed instead of having all of them loaded at the start of the page. I\'m trying

4条回答
  •  隐瞒了意图╮
    2020-12-30 02:52

    After searching for so long and not getting any answers, I ended up with the following

    1. Create an angular app. This is also an angular module.
    2. You can add any directive to the module at any time using app.directive(name,function). These can be directives loaded asynchronously.
    3. You can bootstrap any element. When bootstrapping, specify the app in the list of modules to angular.

    The problem was that yepnope was not firing the complete function as I needed them to be. In the end, I build a small wrapper on top of yepnope that appears to guarantee that the complete function is fired.

    Final code looks something like:

    var app3 = new Cai.AngApp('app3');
    app3.loadControllers('app1.controller3', function () {
            app3.loadDirectives('jsonEditor', 'datePicker', function () {
                app3.bootstrap($('#d3'));
        });
    });
    

提交回复
热议问题