• 欢迎访问搞代码网站,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站!
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏搞代码吧

angularjs需要编译吗?

angularjs 搞代码 4年前 (2021-12-31) 28次浏览 已收录 0个评论

angularjs需要编译,angularjs执行时在初始化完成后需要进行编译,每个节点的编译方法运行之后,$compile服务就会调用链接函数。在$compile服务完成后,AngularJS就准备好了。

Angular应用由许多组件、指令、管道等组成,并且每个组件有自己的HTML模板,它们按照Angular规定的语法进行组织。然而Angular的语法并不能被浏览器直接理解。

为了让浏览器能运行我们写的项目,这些组件、指令、管道和HTML模板必须先被Angular编译器编译成浏览器可执行的Javascript。

AngularJS执行流程:

一、启动阶段

大家应该都知道,当浏览器加载一个HTML页面时,它会将HMTL页面先解析成DOM树,然后逐个加载DOM树中的每一个元素节点。我们可以把AngularJS当做一个类似jQuery的js库,我们通过<script>标签引入到HTML中。

此时Angular就做为一个普通的DOM节点等待浏览器解析,当浏览器解析到这个节点时,发现它是一个js文件,那么浏览器会停止解析剩余的DOM节点,开始执行这个js(即angular.js)。

同时Angular会设置一个事件监听器来监听浏览器的DOMContentLoaded事件。当Angular监听到这个事件时,就会启动Angular应用。

二、初始化

Angular开始启动后,它会查找ng-app指令,然后初始化一系列必要的组件(即injector、injector、co来源[email protected]搞@^&代*@码网mpile服务以及$rootScope),接着重新开始解析DOM树。

三、编译、链接

compile服务通过遍历DOM树的方式查找有声明指令的DOM元素。当碰到带有一个或多个指令的DOM元素时,它会排序这些指令(基于指令的priority优先级),然后使用compile服务通过遍历DOM树的方式查找有声明指令的DOM元素。

当碰到带有一个或多个指令的DOM元素时,它会排序这些指令(基于指令的priority优先级),然后使用injector服务查找和收集指令的compile函数并执行它。

每个节点的编译方法运行之后,$compile服务就会调用链接函数。这个链接函数为绑定了封闭作用域的指令设置监控。这一行为会创建实时视图。

最后,在$compile服务完成后,AngularJS运行时就准备好了。

四、运行阶段

Angular提供了自己的事件循环。指令自身会注册事件监听器,因此当事件被触发时,指令函数就会运行在AngularJS的digest循环中。digest循环中。

digest循环会等待watch表达式列表,当检测到模型变化后,就会调用watch表达式列表,当检测到模型变化后,就会调用watch函数,然后再次查看$watch列表以确保没有模型被改变。

一旦$digest循环稳定下来,并且检测到没有潜在的变化了,执行过程就会离开Angular上下文并且通常会回到浏览器中,DOM将会被渲染到这里。

流程图如下:

以上就是angularjs需要编译吗?的详细内容,更多请关注gaodaima搞代码网其它相关文章!


搞代码网(gaodaima.com)提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected],我们会在看到邮件的第一时间内为您处理,或直接联系QQ:872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:angularjs需要编译吗?

喜欢 (0)
[搞代码]
分享 (0)
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址