AngularJS指令 - 为什么我需要调用compile（）中定义的表达式的link（）中的$ compile？

我有这样的代码：

app.directive('foo', function($compile) { 
    return { 
    restrict: 'E', 
    scope: {}, 
    template: '<span>{{bar}}</span>', 
    compile: function(element, attrs) { 
     element.attr('title', '{{bar}}'); 
     return function(scope, element, attrs) { 
     scope.bar = 'hello'; 
     $compile(element)(scope); 
     } 
    } 
    } 
});

Plunkr： http://plnkr.co/edit/nFTgvYqoiFAthmjoizWS?p=preview

如果删除了$compile位中的链接功能，则title属性保持与表达式文本（{{bar}}），而不是值（'hello' ）;

任何人都可以解释为什么？

我认为（根据我在文档中读到的内容），这是编译阶段的目的 - 操纵模板并为范围和数据绑定的链接做准备。为什么我需要再次手动拨打$compile？模板是否已经编译？

来源

2017-01-01 krulik

也许相名字应该从'compile'，'preLink'被改变，'postLink'为'postCompile '，'preLink'和'postLink'在链接到范围之前，postCompile阶段可用于操作DOM，此时链接函数已创建，但未创建范围。可以添加不需要编译的DOM。如果添加了包含指令或需要插值的其他元素，则需要编译和链接这些附加元素，以使指令和插值起作用。 – georgeawg

要在编译之前对模板进行处理，请为'template'属性提供一个函数：'template：function（tElement，tAttrs）{}'。有关更多信息，请参阅[AngularJS综合指令API参考 - 模板]（https://docs.angularjs.org/api/ng/service/$compile#-template-）。 – georgeawg

@georgeawg谢谢！你能指出我可以自己阅读的参考吗？我想知道我应该如何知道这件事（你怎么知道它:)） – krulik

也许相名字应改为从compile，preLink和postLink到postCompile，preLink和postLink。在链接到范围之前，postCompile阶段可用于操作DOM，此时链接函数已创建，但未创建范围。可以添加不需要编译的DOM。如果添加了包含指令或需要插值的其他元素，则需要编译和链接这些附加元素，以使指令和插值起作用。

要在编译之前对模板进行处理，请为模板属性提供一个函数：template: function(tElement, tAttrs) {}。有关更多信息，请参阅AngularJS Comprehensive Directive API Reference -- Template。

可以共享一个参考“DOM可以添加，无需编译，等等。”或者解释你是如何发现这件事的？

的一些信息来源：

来源

2017-01-01 19:54:42 georgeawg

请分享一个“不需要编译就可以添加DOM”的参考。或者解释你是如何发现这件事的？我真的很想理解这一点，并为将来的挖掘留下自己的空间。 – krulik

AngularJS指令 - 为什么我需要调用compile（）中定义的表达式的link（）中的$ compile？

回答

相关问题