链接vs编译vs控制器 [英] Link vs compile vs controller

问题描述

创建指令时，可以将代码放入编译器，链接函数或控制器中.

When you create a directive, you can put code into the compiler, the link function or the controller.

他们在文档中对此进行了解释:

In the docs, they explain that:

• 编译和链接函数用于角度的不同阶段 循环
• 控制器在指令之间共享

• compile and link function are used in different phases of the angular cycle
• controllers are shared between directives

但是，对我而言，尚不清楚哪种代码应该放在哪里.

However, for me it is not clear, which kind of code should go where.

例如:我可以在编译中创建函数并将它们附加到链接的作用域中，还是仅将函数附加到控制器中的作用域?

E.g.: Can I create functions in compile and have them attached to the scope in link or only attach functions to the scope in the controller?

如果每个指令可以有自己的控制器，则如何在指令之间共享控制器?控制器是真正共享的还是仅仅是作用域属性?

How are controllers shared between directives, if each directive can have its own controller? Are the controllers really shared or is it just the scope properties?

推荐答案

编译:

这是Angular实际编译指令的阶段.对于给定指令的每个引用，仅一次调用此编译函数.例如，假设您正在使用ng-repeat指令. ng-repeat将必须查找其附加到的元素，提取其附加到的html片段，并创建一个模板函数.

This is the phase where Angular actually compiles your directive. This compile function is called just once for each references to the given directive. For example, say you are using the ng-repeat directive. ng-repeat will have to look up the element it is attached to, extract the html fragment that it is attached to and create a template function.

如果使用过HandleBars，下划线模板或等效模板，则类似于编译其模板以提取出模板函数.向此模板函数传递数据，该函数的返回值是html，其中数据位于正确的位置.

If you have used HandleBars, underscore templates or equivalent, its like compiling their templates to extract out a template function. To this template function you pass data and the return value of that function is the html with the data in the right places.

编译阶段是Angular中返回模板函数的那一步.这种以角度表示的模板函数称为链接函数.

The compilation phase is that step in Angular which returns the template function. This template function in angular is called the linking function.

链接阶段:

链接阶段是将数据($ scope)附加到链接函数的阶段，它应该返回链接的html.由于该指令还指定了该html的位置或更改的位置，因此可以很好地使用它.这是您要更改链接的html的功能，即已附加数据的html.如果您在链接功能中编写代码，则为角度形式，通常是后链接功能(默认情况下).这是一种在链接函数将数据与模板链接之后被调用的回调.

The linking phase is where you attach the data ( $scope ) to the linking function and it should return you the linked html. Since the directive also specifies where this html goes or what it changes, it is already good to go. This is the function where you want to make changes to the linked html, i.e the html that already has the data attached to it. In angular if you write code in the linking function its generally the post-link function (by default). It is kind of a callback that gets called after the linking function has linked the data with the template.

控制器:

控制器是放置某些指令特定逻辑的地方.该逻辑也可以进入链接功能，但是您必须将该逻辑放在作用域上才能使其可共享".这样做的问题是，您随后将使用指令的东西破坏范围，而这实际上并不是所期望的. 那么，如果两个指令要互相交谈/彼此合作，该怎么办呢?当然，您可以将所有这些逻辑放入服务中，然后使这两个指令都依赖于该服务，但这只会带来更多的依赖关系.另一种方法是为此范围提供一个Controller(通常是隔离范围?)，然后当该控制器需要"另一个指令时，将该控制器注入到另一个指令中.有关示例，请参见angularjs.org第一页上的标签和窗格.

The controller is a place where you put in some directive specific logic. This logic can go into the linking function as well, but then you would have to put that logic on the scope to make it "shareable". The problem with that is that you would then be corrupting the scope with your directives stuff which is not really something that is expected. So what is the alternative if two Directives want to talk to each other / co-operate with each other? Ofcourse you could put all that logic into a service and then make both these directives depend on that service but that just brings in one more dependency. The alternative is to provide a Controller for this scope ( usually isolate scope ? ) and then this controller is injected into another directive when that directive "requires" the other one. See tabs and panes on the first page of angularjs.org for an example.

这篇关于链接vs编译vs控制器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！