1

似乎很普遍，您不需要经常手动编译元素（通过 $compile 服务）。由于一些动态驱动的 html，我们有一个指令在链接函数中进行手动编译。像这样的事情（动态 html 的实际检索要复杂得多）：

    link: function(scope, element, attrs) {
        element.append(someService.getDynamicHtml());
        $compile(element.contents())(scope);
    }

我们已经开始遇到一些性能问题，因为有一个页面多次发出这个指令，每次编译需要 300 毫秒左右。

为了更好地理解“幕后”发生的事情，从而做出更好的设计决策，我的问题是在链接功能中间进行这种手动编译与提供带有模板的指令并让角度自然地编译它？

这是一个演示我正在谈论的两个场景的小提琴：http: //jsfiddle.net/KNLea/

我认为我们可以重构我们的动态 html 生成，以便它构造一个字符串，然后我们可以将它用作模板。上面的内容被更改为这样的：

    template: someService.getDynamicHtml(),
    link: function(scope, element, attrs) {
        //no need for manual compile anymore
    }

我只是想了解两者有什么根本区别，以及我们可以预期的性能提升（如果有的话）。它根本没有区别吗？当 Angular 编译模板时，它是否与 $compile 服务做同样的事情？或者模板的自然编译是否存在潜在的差异，会影响性能？

4

1 回答 1

1

Angular 本身用于$compile编译指令模板，因此手动编译并没有固有的减速。

但是，真正起重要作用的是编译的时间和频率。

Angular 将为每个指令实例编译一次，然后根据需要链接多次。
另一方面，您对每个链接进行额外的编译+链接。这是很多开销。

动态 HTML 的动态程度尚不清楚，但如果它在会话的生命周期内保持不变，则有更有效的编译方法。

于 2014-06-03T05:25:28.360 回答