angularjs 学习笔记

yongyuan.jiang

浏览: 471967 次
性别:
来自: 深圳

最近访客更多访客>>

leimingchao

u012041936

guantemp

u013305830

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

scope：

scope.$parent指向scope的父作用域；
scope.$$childHead指向scope的第一个子作用域；
scope.$$childTail指向scope的最后一个子作用域；
scope.$$nextSibling指向scope的下一个相邻作用域；
scope.$$prevSibling指向scope的上一个相邻作用域；

directives scope:

默认 (scope: false) - directive使用原有作用域，所以也不存在原型继承，这种方式很简单，但也很容易出问题——除非该directive与html不存在数据绑定，否则一般情况建议使用第2条方式。
scope: true - directive创建一个子作用域, 并且会从父作用域进行原型继承。如果同一个DOM element存在多个directives要求创建子作用域，那么只有一个子作用域被创建，directives共用该子作用域。
scope: { ... } - directive创建一个独立的“Isolate”作用域，没有原型继承。这是创建可复用directive组件的最佳选择。因为它不会直接访问/修改父作用域的属性，不会产生意外的副作用。这种directive与父作用域进行数据通信有如下四种方式（更详细的内容请参考Developer Guide）：
1. = or =attr “Isolate”作用域的属性与父作用域的属性进行双向绑定，任何一方的修改均影响到对方，这是最常用的方式；
2. @ or @attr “Isolate”作用域的属性与父作用域的属性进行单向绑定，即“Isolate”作用域只能读取父作用域的值，并且该值永远的String类型；
3. & or &attr “Isolate”作用域把父作用域的属性包装成一个函数，从而以函数的方式读写父作用域的属性，包装方法是$parse，详情请见API-$parse；

link 和 controller区别:

聪明的读者可能想知道link 和 controller之间的区别，最基本的区别就是 控制器可以导出一个API，而子指令的link函数可以通过require来与这个API交互。

最佳实践: 当你想暴露一个API给其它的指令调用那就用controller,否则用link。

哪些指令支持动画呢？

部分AngularJS指令支持在它的生命周期内发生重要事件时触发动画钩子，下面的表格详细说明了哪些动画事件会被触发。

Directive 支持动画

`ngRepeat`	enter , leave , move
ngView	enter , leave
`ngInclude`	enter , leave
`ngSwitch`	enter , leave
`ngIf`	enter , leave
`ngClass or {{class}}`	add , remove
`ngShow & ngHide`	add , remove (the ng-hide class value)

对于各个动画事件的详细触发步骤，请参考API 文档。

编译器compile 和 link区别

编译器是 Angular 提供的一项服务，用来遍历DOM节点，查找特定的属性。编译过程分为两个阶段：

编译：遍历DOM节点，收集所有的指令，返回一个连接函数（link func）
连接：将上一步收集到的每个指令与其所在的作用域（scope）连接生成一个实时视图。任何作用域中的模型改变都会实时在视图中反映出来，同时任何用户与视图的交互则会映射到作用域的模型中。这样，作用域中的数据模型就成了唯一的数据源。

一些如 ng-repeat 这样的指令，会为集合中的每个项目克隆一次DOM元素。由于克隆的模板只需要被编译一次，然后为每个克隆实例做一次连接，这样将编译分成编译和连接两个阶段就有效地提升了性能（译注：不用为每个克隆的实例都编译一次，只需对模板进行统一的一次编译，然后在连接阶段单独为每个实例进行到 scope 的连接即可）。

解析define js

  sed -n '/define/p' starter.js 
  513  sed -n '/ define/p' starter.js 
  514  sed -n '/ define\(.*\),/$1/p' starter.js 
  515  sed -n '/ define\(.*\),/\1/p' starter.js 
  516  sed -n '/ define\.*,/\(1\)/p' starter.js 
  517  sed -n '/ define\*,/\(1\)/p' starter.js 
  518  sed -n '/ define\*,/\($1\)/p' starter.js 
  519  sed -n '/ define\(.*\),/\1/p' starter.js 
  520  sed -n '/ define(.*),/\1/p' starter.js 
  521  sed -n '/ define(.*),/$1/p' starter.js 
  522  sed '/ define(.*),/$1/p' starter.js 
  523  sed 's/ define(.*),/$1/p' starter.js 
  524  sed 's/ define(.*),/$1/' starter.js 
  525  sed 's/ define(.*),/\1/' starter.js 
  526  sed 's/.* define(.*),.*/\1/' starter.js 
  527  sed 's/.* define(.*),.*/$1/' starter.js 
  528  sed -n '/ define(.*),/$1/p' starter.js 
  529  sed 's/.* define(.*),.*/$1/' starter.js 
  530  sed -n 's/.* define(.*),.*/$1/' starter.js 
  531  sed -n 's/.* define(.*),.*/$1/p' starter.js 
  532  sed -n 's/.* define(.*),.*/\1/p' starter.js 
  533  sed -n '/.* define(.*),.*/\1/p' starter.js 
  534  sed -n '/ define/p' starter.js 
  535  sed -n '/ define/p' starter.js > temp.js
  536  ls
  537  vi temp.js 
  538  ls
  539  grep  -n '/\//p' temp.js 
  540  grep  -n '/.*\/.*/p' temp.js 
  541  grep  -n '/.*\/.*/p' temp.js  > t2.js
  542  sed  -n '/.*\/.*/p' temp.js  > t2.js
  543  sed  -n '/define.*\/.*/p' t2.js  > t3.js
  544  sed  -n '/define.*\/.*,/$1/' t2.js  > t3.js
  545  sed  -n '/define.*\/.*,/\1/' t3.js 
  546  sed  -n '/define.*\/.*,/\\1/' t3.js 
  547  sed  -n '/define.*\/.*,/$1/' t3.js 
  548  sed  -n 's/define.*\/.*,/$1/' t3.js 
  549  sed  -n 's/define.*\/.*,/$1/p' t3.js 
  550  sed  's/define.*\/.*,/$1/' t3.js 
  551  sed  's/define.*\/.*,/、1/' t3.js 
  552  sed  's/define.*\/.*,/\1/' t3.js 
  553  sed  's/define(.*\/.*),/\1/' t3.js 
  554  sed  's/define\(.*\/.*\),/\1/' t3.js 
  555  sed  's/.*define\(.*\/.*\),.*/\1/' t3.js 
  556  sed  's/.*define\(.*\/.*\),.*/\1/p' t3.js 
  557  sed  's/.*define\(.*\/.*\),.*/asdf/' t3.js 
  558  sed  's/.*define(.*\/.*),.*/\1/' t3.js 
  559  sed  's/.*define\(.*\/.*\),.*/\1/p' t3.js 
  560  sed  's/.*define\(.*\/.*\).*/\1/p' t3.js 
  561  sed  's/.*\(.*\/.*\).*/\1/p' t3.js 
  562  sed  's/.*define.*\/.*.*/\1/p' t3.js 
  563  sed  's/.*define.*\/.*.*/kjh/p' t3.js 
  564  sed  's/.*define.*\/.*.*/kjh/' t3.js 
  565  sed  's/.*define\(.*\/.*\).*/\1/' t3.js 
  566  sed  's/.*define\(.*\/.*\),/\1/' t3.js 
  567  sed  's/.*define\(.*\/.*\).*/\1/' t3.js 
  568  cat t3.js 
  569  sed  -n '/define.*\/.*/p' t2.js  > t3.js
  570  sed  's/.*define\(.*\/.*\).*/\1/' t3.js 
  571  sed  's/.*define\(.*\/.*\),.*/\1/' t3.js 
  572  sed  's/.*define\(.*\/.*\),/\1/' t3.js 
  573  sed  's/.*define("\(.*\/.*\)",/\1/' t3.js 
  574  sed  's/.*define("\(.*\/.*\)",.*/\1/' t3.js 
  575  sed  's/.*define("\(.*\/.*\)", [.*/\1/' t3.js 
  576  sed  's/.*define("\(.*\/.*\)", \[.*/\1/' t3.js 
  577  sed  's/.*define("\(.*\/.*\)",\[.*/\1/' t3.js 
  578  sed  's/.*define("\(.*\/.*\)[", \[].*/\1/' t3.js 
  579  sed  's/.*define("\(.*\/.*\)[", \[]*.*/\1/' t3.js 
  580* sed  's/.*define("\([a-zA-Z\/].*\).*/\1/' t3.js 
  581  sed  's/.*define("\(.*\/.*\)[", \[]*.*/\1/' t3.js 
  582  sed  's/.*define("\(.*\/.*\)", [.*/\1/' t3.js 
  583  sed  's/.*define("\(.*\/.*\)", \[.*/\1/' t3.js 
  584  sed  's/.*define("\(.*\/.*\)", \[.*/\1/' t3.js  > t4
  585  sed  's/.*define("\(.*\/.*\)", \[.*/\1/' t4
  586  sed  's/.*define("\(.*\/.*\)", .*/\1/' t4
  587  sed  's/.*define("\(.*\/.*\)",.*/\1/' t4
  588  sed  's/.*define("\(.*\/.*\)",.*/\1/' t4 > t5.js
  589  ls
  590  cd ..
  591  ls
  592  cd src
  593  ls
  594  cd lib
  595  ls
  596  sed ../../bin/t5.js 
  597  sed 's/lib/p' ../../bin/t5.js 
  598  sed -n '/lib//p' ../../bin/t5.js 
  599  sed -n '/lib/wget \1/p' ../../bin/t5.js 
  600  sed -n '/\(.*lib.*\)/wget \1/p' ../../bin/t5.js 
  601  sed 's/\(.*lib.*\)/wget \1/p' ../../bin/t5.js 
  602  sed 's/\(.*lib.*\)/wget \1/' ../../bin/t5.js 
  603  sed -n 's/\(.*lib.*\)/wget \1/p' ../../bin/t5.js 
  604  sed -n 's/\(.*lib.*\)/wget \1/p' ../../bin/t5.js 
  605  sed -n 's/\(.*lib.*\)/\1.js/p' ../../bin/t5.js 
  606  sed -n 's/\(.*lib.*\)/\1.js/p' ../../bin/t5.js > downloadlib.shell
  607  chmod +x downloadlib.shell 
  608  ./downloadlib.shell 
  609  ls
  610  sed -n 's/\(.*lib.*\)/\1.js"></script>/p' ../../bin/t5.js
  611  sed -n 's/\(.*lib.*\)/\1.js"><\/script>/p' ../../bin/t5.js
  612  sed -n 's/\(.*lib.*\)/\1.js"><\/script>/p' ../../bin/t5.js > appendJs.txt
  613  sed -n 's/\(.*app.*\)/\1.js"><\/script>/p' ../../bin/t5.js > appendJs.txt
  614  ls
  615  cd ..
  616  ls
  617  cd app
  618  ls
  619  sed -n 's/\(.*app.*\)/\1.js/p' ../../bin/t5.js > downloadlib.shell
  620  cat downloadlib.shell 
  621  cat ../lib/downloadlib.shell 
  622  sed -n 's/\(.*app.*\)/\1.js/p' ../../bin/t5.js > downloadlib.shell
  623  sed -n 's/\(.*app\/[a-Z]\)/\1.js/p' ../../bin/t5.js > downloadlib.shell
  624  sed -n 's/\(.*app\/[a-Z]*\)/\1.js/p' ../../bin/t5.js > downloadlib.shell
  625  sed -n 's/\(.*app\/\d*\)/\1.js/p' ../../bin/t5.js > downloadlib.shell
  626  cat downloadlib.shell 
  627  sed -n 's/\(.*app\/[a-z]*\)/\1.js/p' ../../bin/t5.js > downloadlib.shell
  628  cat doe
  629  cat downloadlib.shell 
  630  sed -n 's/\(.*app\/[a-Z]*\)/\1.js/p' ../../bin/t5.js > downloadlib.shell
  631  sed -n 's/\(.*app\/[a-z|A-Z]*\)/\1.js/p' ../../bin/t5.js > downloadlib.shell
  632  cat downloadlib.shell 
  633  sed -n 's/\(.*app\/[a-z|A-Z]*\)$/\1.js/p' ../../bin/t5.js > downloadlib.shell
  634  cat downloadlib.shell 
  635  sed -n 's/\(.*app\/[a-z|A-Z|\.|_]*\)$/\1.js/p' ../../bin/t5.js > downloadlib.shell
  636  cat downloadlib.shell

分享到：

安卓按钮底部 | Cg Programming/Unity/Transparent Texture ...

2015-08-29 11:52
浏览 637
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论