定义指令时,“控制器”,“链接”和“编译”功能之间的区别
有些地方似乎将控制器功能用于指令逻辑,而其他地方则使用链接。 角度主页上的选项卡示例将控制器用于一个,并链接另一个指令。 两者有什么区别?
我将扩展你的问题,并且还包括编译功能。
编译函数 - 用于模板 DOM操作(即,tElement = template元素的操作),因此适用于与指令相关联的模板的所有DOM克隆的操作。 (如果你还需要一个链接函数(或者前后链接函数),并且你定义了一个编译函数,编译函数必须返回链接函数,因为'compile'
属性是'link'
属性会被忽略定义。)
链接函数 - 通常用于注册监听器回调(即范围中的$watch
表达式)以及更新DOM(即iElement =独立实例元素的操纵)。 它在模板被克隆后执行。 例如,在<li ng-repeat...>
,链接函数在<li>
模板(tElement)已被克隆(到iElement中)之后执行,用于特定的<li>
元素。 $watch
允许向指令通知范围属性更改(范围与每个实例关联),这允许指令将更新的实例值呈现给DOM。
控制器功能 - 当另一个指令需要与此指令交互时,必须使用它。 例如,在AngularJS主页上,窗格指令需要将自身添加到由tabs指令维护的范围中,因此tabs指令需要定义窗格指令可以访问/调用的控制器方法(think API)。
要更深入地了解选项卡和窗格指令,以及为什么tabs指令使用this
(而不是$scope
)在其控制器上创建函数,请参阅AngularJS控制器中的'this'和$ scope。
通常,您可以将方法$watches
等放入指令的控制器或链接函数中。 控制器将首先运行,这有时很重要(当ctrl和link函数运行两个嵌套指令时,请参阅此日志记录)。 正如Josh在评论中提到的,为了与框架的其他部分保持一致,您可能需要将范围操作函数放在控制器中。
作为对马克答案的补充,编译函数无权访问范围,但链接函数可以。
我真的推荐这个视频; 由Misko Hevery(AngularJS的父亲)撰写指令,他描述了差异和一些技巧。 (视频中14:41标记的编译功能和链接功能的区别)。
Angular约定:在链接中写入控制器和DOM操作的业务逻辑。
除此之外,您可以从另一个指令的链接函数调用一个控制器函数。例如,您有3个自定义指令
<animal>
<panther>
<leopard></leopard>
</panther>
</animal>
并且您想从“豹”指令的内部访问动物。
http://egghead.io/lessons/angularjs-directive-communication将有助于了解关于指导间的沟通
链接地址: http://www.djcxy.com/p/77903.html上一篇: Difference between the 'controller', 'link' and 'compile' functions when defining a directive