angularJS进阶阶段(4)】的更多相关文章

angularJS进阶阶段(4) 编译器/$compile 编译器$compile是一个AngularJS的内置服务,它负责遍历DOM树来查找匹配指令, 并调用指令的实现代码进行处理. HTML编译包括3个步骤: 匹配指令$compile遍历DOM树,如果发现有元素匹配了某个指令,那么这个指令将被加入 该DOM元素的指令列表中.一个DOM元素可能匹配多个指令. 执行指令的编译函数当一个DOM元素的所有指令都找齐后,编译器根据指令的优先级/priority指令进行排序. 每个指令的compile函…
AngularJS进阶(四十)创建模块.服务 学习要点 使用模块构架应用 创建和使用服务 为什么要使用和创建服务与模块? 服务允许你打包可重用的功能,使之能在此应用中使用. 模块允许你打包可重用的功能,使之能跨应用使用. 一.应用程序模块化 先看看一个没有模块化的程序 <!DOCTYPE> <!-- use module --> <html ng-app="exampleApp"> <head> <title>Angluar…
参考:http://***/class/54f3ba65e564e50cfccbad4b 1. AJAX:Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)可以与服务器交换数据并更新部分网页,而无需重新加载整个页面. 2. JQuery:浏览器里原生的JavaScript有点像汇编语言,不同的浏览器就像不同的CPU架构,汇编语言各有千秋,这让前端开发者很恼火.聪明人很快发现了这个痛点,于是,抹平浏览器差异的jQuery库出现了. 3. An…
基于项目实战解析ng启动加载过程 前言 在AngularJS项目开发过程中,自己将遇到的问题进行了整理.回过头来总结一下angular的启动过程. 下面以实际项目为例进行简要讲解. 1.载入ng库 2.等待,直到DOM树构造完毕. 3.发现ng-app,自动进入启动引导阶段. 4.根据ng-app名称找到相应的路由. 5.加载默认地址. 6.Js顺序执行,加载相应模版页 sys_tpls/home.html 7.在此,可以看到index路由中只是填充了ui-view为sys_login的div模…
深入理解ANGULARUI路由_UI-ROUTER 最近在用 ionic写个webapp 看到几个demo中路由有好几种,搞的有点晕,查下资料研究下,做个笔记,其中大部分为摘抄别人的,做个说明免得被人吐槽. Angularjs ui-router - 组件: $state / $stateProvider: 管理状态定义.当前状态和状态转换.包含触发状态转换的事件和回调函数,异步解决目标状态的任何依赖项,更新$location到当前状态.由于状态包含关联的 url,通过$urlRouterPro…
有关自定义指令的scope参数,网上很多文章都在讲这3种绑定方式实现的效果是什么,但几乎没有人讲到底怎么使用,本篇希望聊聊到底怎么用这个话题. 一. 自定义指令 自定义指令,是Angularjs用来实现组件化的方式,相比于React和Vue的组件化方式,它真的很复杂,自定义指令太重了,它暴露了太多可供定制的参数,以至于普通的开发者完全不知道要用它来做什么而将其束之高阁,毕竟一般的业务逻辑通过controller和service就已经可以完成了. 自定义指令在Angularjs项目中主要有两大用途…
AngularJS上拉加载问题解决方法 项目中始终存在一个问题:当在搜索栏输入关键词后(见图1),按照既定的业务逻辑应该是服务端接收到请求后,首先返回查询的前7条数据,待客户端出现上拉加载时,继续查找另外7条数据.但实际情形是不确定的,在服务端控制台(见图2)可看到begno一直到了126,也就是相当于客户端往服务端请求了127次,这是一个令人无法忍受的结果. 图1 客户端搜索栏 图2 服务端控制台 可以断定是客户端的业务逻辑出现了问题.返回到客户端,查看源码逻辑,修改如下:       控制器…
requirejs + angular + angular-route 浅谈HTML5单页面架构 众所周知,现在移动Webapp越来越多,例如天猫.京东.国美这些都是很好的例子.而在Webapp中,又要数单页面架构体验最好,更像原生app.简单来说,单页面App不需要频繁切换网页,可以局部刷新,整个加载流畅度会好很多. 废话就不多说了,直接到正题吧,浅谈一下我自己理解的几种单页面架构: 1.requirejs+angular+angular-route(+zepto) 最后这个zepto可有可无…
IE浏览器兼容性后续 前言 继续尝试解决IE浏览器兼容性问题,结局方案为更换jquery.angularjs.IE的版本. 1.首先尝试更换jquery版本为1.7.2 jquery-1.9.1.js --> jquery-1.7.2.js -->  jquery2.1.4.js 无效 2.尝试更换IE版本IE8 IE11 --> IE8(本机系统不支持) --> IE10 angular-1.3.0.14 -->angular-1.2.0 相关代码如下: <div c…
AngularJS项目开发技巧之利用Service&Promise&Resolve解决图片预加载问题(后记) 前言 在"AngularJS项目开发技巧之图片预加载"一文中,自己曾经天真的认为提升服务端带宽就可以解决图片加载问题.但自己的想法错了,通过阅读破狼的书<AngularJS深度剖析与最佳实践>,隐隐察觉到是自己的项目架构出现了问题.存在很多待优化的地方.其书中这样写到"如果在实例化控制器之前,需要准备一些特定数据,或者有条件的阻止进入路由,…