的“控制器”,“链接”和之间的差异定义指令时“编译”功能(Difference between th

2019-06-18 06:41发布

有些地方似乎使用控制器功能指令的逻辑和其他人使用的链接。 上的角主页选项卡的例子使用一个控制器和链路另一指令。 两者有什么区别?

Answer 1:

我要扩大你的问题了一下,还包括编译功能。

  • 编译函数 -用于模板 DOM操作(即,tElement =模板元件的操作),因此适用于与指令相关的模板的所有DOM克隆操作。 (如果您还需要一个链接功能(或前,后链接功能),你定义一个编译函数,编译函数必须返回链接功能(S),因为'link'如果属性被忽略'compile'属性定义。)

  • 链接函数 -通常使用用于注册监听器回调(即, $watch的范围的表述),以及更新所述DOM(即,iElement =个别实例元素的操纵)。 模板已被克隆后执行。 例如,内部<li ng-repeat...>链接功能被执行后<li>模板(tElement)已被克隆(成iElement),用于那个特定的<li>元素。 一个$watch允许(相当的范围与每个实例相关联)被通知的范围属性更改指令,允许指令呈现更新的实例值到DOM。

  • 控制器功能 -必须在另一个指令需要与这个指令交互使用。 例如,AngularJS主页上,窗格指令需要将自身添加到由标签指令维护的范围,因此标签指令需要定义一个控制器方法(认为API),该窗格指令可以访问/调用。

    为了更深入的解释选项卡和窗格指令,为什么标签指令创建它的控制器上使用函数this (而不是在$scope ),请参见“本” VS在AngularJS控制器$范围 。

在一般情况下,你可以把方法, $watches等进入或者指令的控制器或链接功能。 该控制器将首先运行,这有时事项(见本拨弄当CTRL和链接功能与两个嵌套的指令运行的记录)。 随着约什在提到过的评论 ,你可以把它放到范围操纵功能的控制器内刚的一致性与框架的其余部分。



Answer 2:

作为补充,马克的回答,编译函数没有访问范围,但链接的功能一样。

我真的建议此视频; 写指令通过MISKO Hevery(AngularJS的父亲),他介绍了分歧和一些技巧。 (编译功能和链接功能的区别14:41标记视频 )。



Answer 3:

  1. 在编译之前运行的代码:使用控制器
  2. 编译后运行的代码:使用链接

角约定:在控制器和DOM操作的链接编写业务逻辑。

除了这个,你可以从另一个调用directive.For例子的链接功能一个控制器功能,你有3组自定义指令

<animal>
<panther>
<leopard></leopard>
</panther> 
</animal>

你想从“豹”指令的内部访问的动物。

http://egghead.io/lessons/angularjs-directive-communication将有助于了解跨指令通信



Answer 4:

编译功能 -

  1. 控制器和链接功能之前被调用。
  2. 在编译功能,您有原始模板DOM这样就可以使在原来的DOM变化AngularJS创建它的一个实例之前并创建范围之前
  3. NG-重复就是很好的例子 - 原语法是模板元素,在HTML中的重复元素实例
  4. 可以有多个元素实例只有一个模板元
  5. 范围尚未公布
  6. 编译函数可以返回功能和对象
  7. 返回(链接后)函数 - 相当于当编译函数为空经由配置对象的链路属性注册所述链接功能。
  8. 返回通过前,后的属性注册功能(多个)的对象 - 可用于控制何时链接函数应该在链接阶段被调用。 看到前联和后下联的功能信息。

句法

function compile(tElement, tAttrs, transclude) { ... }

调节器

  1. 所谓的编译功能之后
  2. 范围可以在这里找到
  3. 可以通过其他指令被访问(见要求属性)

预-链接

  1. 链接函数是负责注册DOM监听以及更新的DOM。 模板已被克隆后执行。 这是大多数指令的逻辑将被投入。

  2. 您可以使用angular.element更新控制器中的DOM,但作为元素在链接功能提供不建议这样做

  3. 预链接功能来实现运行逻辑,当角JS已经编制的子元素,但在此之前任何一个子元素的帖子链接已被称为

后链接

  1. 指令仅具有链接功能,棱角分明的治疗功能的帖子链接

  2. 会后经过编译,控制器和预链接功能可按被执行,所以这就是为什么这被认为是最安全和默认的地方加入您的指令逻辑



文章来源: Difference between the 'controller', 'link' and 'compile' functions when defining a directive