Question

我想知道当指令的内容写入DOM时是否有办法批处理实际的dom。

用例是一个大型DOM，我想通过大批量更新DOM而不是许多小更新来优化。我正在尝试编译动态子指令列表，但我没有看到确保指令打包并作为单个DOM更新发送的方法。

考虑下面的例子：

angular.module('test').directive('parentDirective',function($compile){

  return{
    link:function(scope, elem){
       var html = '';
       for(var i = 0; i < 10; i++){
         html += "<child-directive val='someValue'></child-directive>";
       }
       var e = angular.element(html);

       e.html(e);

       $compile(e)(scope);
    }

  };

});

//Using the parent-directive will dynamically add n child directives. 

<parent-directive>
<child-directive></child-directive>
<child-directive></child-directive>
..
<child-directive></child-directive>
</parent-directive>

每个子指令都使用一个模板，我想知道，有没有办法在一次更新中“批量写”所有子指令？而不是让每个子指令独立发出DOM更新。子指令使用隔离范围，模板在整个模板中引用范围对象。模板是通过子指令中的templateUrl引用的大块html。

我不能通过简单地内联模板来跳过子指令，因为结构需要重复并且数据绑定。

从指令批处理DOM更新

0 个答案: