发表于: 2016-10-14 23:28:36

1 1863


今天完成的事:

1. 修改前面Task7,把发放玩家身份页面的控制器里的逻辑部分提取放入factory中;

2. 找资料看angularJS通过derictive来操作DOM

 

明天计划的事:。

1. 继续修改Task7其他页面。

 

今天遇到的问题:

 

收获:

1. AngularJS内置精简版的jQuery – jqLitejqLiteangular.element接口提供出来,兼容jQuery API的一个子集。 AngularJS的所有API中的element对象,都不是纯粹的DOM对象,而是经过jqLite 封装过的。

可以在AngularJS之前引入jQuery库。 AngularJS自动地将jqLite升级jQueryangular.element等同于 $

2.自定义指令基础知识:

  1. (1) restrict: 说明指令在HTML中的应用形式,备选项有"A""E" "C" "M" ,分别代表 attributeelementclasscomment(默认值为"A")。
  2. (2) scope: 创建指令的作用范围,scope在指令中作为属性标签传递。Scope 是创建可以复用指令的必要条件,每个指令(不论是处于嵌套指令的哪一级)都有其唯一的作用域,它不依赖于父scopescope 对象定义names types 变量。
    • (3) name: "@" (值传递,单向绑定): 
            "@"
      符号表示变量是值传递。指令会检索从父级scope中传递而来字符串中的值。指令可以使用该值但无法修改,是最常用的变量。
    • amount:       "=" (引用,双向绑定) 
            "="
      符号表示变量是引用传递。指令检索主Scope中的引用取值。值可以是任意类型的,包括复合对象和数组。指令可以更改父级Scope中的值,所以当指令需要修改父级Scope中的值时就需要使用这种类型。
    • (4)save: "&" (表达式
            “&”
      符号表示变量是在父级Scope中启作用的表达式。它允许指令实现比修改值更高级的操作。
  1. template:      替代原始模板中的标记的字符串。替换功能将替换所有旧元素为新值。注意template是如何使用Scope中定义的变量的。这允许你无需写任何额外的代码即可创建macro-style 风格指令。replace: 说明是否替换原始标记中的值或是追加原始标记中的值。默认值是false,这时原始标记将被保留。
  2. (5) transclude: 说明自定义指令是否复制原始标记中的内容。例如,之前展示的“tab”指令设置了transclude true,因为tab 元素包含其他HTML 元素。 "dateInput" 指令则需要在初始化时为空,所以需要设置transclude false
  3. link: 该方法在指令中扮演着重要的角色。它负责执行DOM 操作和注册事件监听器等。link 方法包含以下参数:
    • (6) scope: 指令Scope的引用。scope       变量在初始化时是不被定义的,link 方法会注册监视器监视值变化事件。
    • (7)element: 包含指令的DOM元素的引用, link       方法一般通过jQuery       操作实例(如果没有加载jQuery,还可以使用Angular's jqLite )。
    • (8)controller: 在有嵌套指令的情况下使用。这个参数作用在于把子指令的引用提供给父指令,允许指令之间进行交互

注意,当调用link 方法时, 通过值传递("@")的scope 变量将不会被初始化,它们将会在指令的生命周期中另一个时间点进行初始化,如果你需要监听这个事件,可以使用scope.$watch 方法。 



返回列表 返回列表
评论

    分享到