ANGULAR.JS2021-01-09演讲人目录01.02.适用范围特点04.03.Angular表达式标记06.05.MVC引导程序07 .双向绑定01适用范围增删改查页面ABC数据绑定基本模板标识符表单验证DEF路由深度链接组件重用增删改查页面依赖注入测试增删改查页 面测试单元测试端对端测试模拟和自动化测试框架适用范围端到端的解决方案02特点特点010203使用双大括号进行数据绑定使用DOM控制 结构来实现迭代或者隐藏DOM片段支持表单和表单验证040506能将逻辑代码关联到相关的DOM元素能将HTML分组成可重用的组件节省 了侦听器和DOM控制器代码,因为已经包含在AngularJS中了特点MVC服务特性特点MVC模型数据(Data)应用程序逻辑(Lo gic)和行为(Behavior)模板(Templates)特点服务特性030102缓存依赖注入XHR060405URL路由浏览器 抽象服务扩展和添加自己特定的服务03标记标记ng-app告诉AngularJS处理整个HTML页并引导应用01标记了Angular JS脚本的作用域02标记ng-model绑定模型变量标记ng-controller绑定控制器,即函数可以调用控制器范围内的变量ng -click绑定事件通过controller调用,可以使用model变量标记$标记是angular专有属性ng-repeat重复执 行模板语法(phoneinphones)标记ng-bind标记标签绑定某个表达式,表达式控制标签的值标记ng-bind-htm l判断表达式,并把结果以安全的方式插入元素标记ng-bind-template标识元素的文本内容用ngBindTemplate属性 的模板内容替换标记ng-blur在blur事件中指定自定义行为标记ng-change标记ng-checked标记ng-class允 许通过数据绑定表达式的方式动态设置html元素的css类标记ng-class-even标记ng-class-odd跟ng-clas s一样,但是通过行数的奇偶性来判断标记ng-cloak用于防止程序加载完时angular模板被立即加载到表单。也避免模板显示时的闪 烁效果标记ng-copy定义复制触发事件标记ng-csp开启内容安全策略标记ng-cut标记ng-dblclick标记ng-dis abled0102更方便的让按钮在某些浏览器下可用,某些浏览器下不可用其实就是开启状态的动态控制标记ng-focus标记ng-fo rm标记ng-hide标记ng-href标记ng-if标记ng-include把其他的html页面引用进来标记ng-init允许在 当前范围内评价一个表达式标记ng-keydown标记ng-keypress标记ng-keyup标记ng-list把内容转成数组标记 ng-model-options标记ng-mousedown标记ng-mouseenter标记ng-mouseleave标记ng- mousemove标记ng-mouseover标记ng-mouseup标记ng-non-bindable标记节点不被绑定标记ng- open标记ng-paste标记ng-pluralize标记ng-readonly标记ng-repeat标记ng-selected 标记ng-show标记ng-src标记ng-srcset标记ng-style标记ng-submit标记ng-switch标记ng- transclude标记ng-value标记script04Angular表达式Angular表达式类似于Javascript表达 式Angular表达式类似于Javascript表达式010203不能用eval()区别互用属性表达式Angular对应于当前作 用域Javascript对应于全局window对象允许未定义值Angular允许undefined或者nullJavascri pt抛出异常没有控制结构Angular不能用条件判断不能用循环不能抛出异常Javascript允许控制结构过滤器(类似uni x中的管道操作符)Angular可以通过过滤器链来传递表达式的结果互用Angular使用Javascript写成控制器的方法,然 后在表达式中调用这个方法Javascript使用Angular使用$eval()05引导程序引导程序ng-app手动加载ang ular.element(document).ready(function(){??????angular.boo tstrap(document);??????});06MVCMVC控制器视图ng-controller模型07双向绑定双向绑定感谢聆听 |
|