AngularJS - 何时指令范围数据首先绑定到DOM?

时间:2018-01-28 22:27:10

标签: javascript angularjs angularjs-directive angularjs-scope

我对AngularJS如何处理指令有一般的了解但是我不确定范围属性的数据何时被绑定到指令的HTML模板中的相应表达式。我对指令处理的理解(用简化的术语)是这样的:

  • AngularJs收到原始DOM渲染完成的通知(即发送到浏览器的初始HTML已被解析,DOM现已初始化)
  • AngularJS读取DOM并“收集”它找到的所有AngularJS指令。
  • 每个指令都包装为'Angular元素',然后在每个指令上执行'compile'函数。编译函数自动接收'template element'作为参数。 'template element'提供对指令的原始HTML模板的访问,包括要插值的任何表达式。模板元素的HTML可能如下所示:

    <my-directive>

        {{myProperty}}
    

    </my-directive>

  • 然后执行指令中'compile'的任何自定义逻辑

  • 编译后,返回一个'link'函数,它会自动接收当前作用域作为参数。

  • 执行控制器中的任何逻辑。

  • (如果在指令中定义了任何预连接逻辑,那么它将被执行,但我们假设我们没有这样做)

  • 然后自动调用链接功能 - '链接'的目的和意义是它将范围与模板“链接”,并且在这个点设置手表关于范围,包括{{myProperty}}值的监视 (参见官方AngularJS文档中的“如何编制指令” - https://docs.angularjs.org/guide/compiler

  • 然后执行指令中定义的任何后期链接逻辑(如果我们只在我们的指令中定义了'link'函数,那么它就像是'post-link'逻辑一样执行,就像我们有的一样在我们的指令中定义了一个'post:'函数)
  • 模板附加到DOM

如果我们假设该指令具有隔离范围,那么在此过程中,{em>首先中的{{myProperty}}取代了当前范围内该属性的值,并且该怎么做AngularJS这样做?假设我对指令处理的理解是正确的,看起来初始替换可能是在执行后链接逻辑之前完成的 - 这是正确的吗?

0 个答案:

没有答案