一尘不染

等待加载angularjs指令模板

angularjs

我想做的是推迟为指令加载角度js模板,直到我真正需要它为止。我什至根本不需要它。有没有一种方法可以只在需要时才加载指令的模板。服务会成为这样做的方式吗?我的应用程序已经加载了很多指令模板,除非我需要,否则我希望避免加载太多的东西。当前的确切问题是为登录表单加载模板。如果用户单击按钮,但他/她未登录,则我要slideOpen(使用jQuery)登录表单。


阅读 272

收藏
2020-07-04

共1个答案

一尘不染

在绝大多数情况下,动态加载静态指令模板没有任何价值。它们是如此之小,以至于没有意义。但是,有可能。但是,大多数情况下,此策略用于动态模板。

它需要$http获取模板并将$compile其连接到AngularJS。

app.directive('testDirective', function($http,$compile) {
  return {
    scope: { show: '&' },
    link: function( scope, element, attrs ) {
      var tpl,
          url = 'testDirective.tpl.html';

      scope.$watch( 'show()', function (show) {
        if ( show ) {
          showTheDirective();
        }
      });

      function showTheDirective () {
        if ( !tpl ) {
          $http.get( url ).then( function ( response ) {
            tpl = $compile( response.data )( scope );
            element.append(tpl);
          });
        }
      }
    }
  };
});

这是一个表明它有效的Plunker

2020-07-04