angular指令 directive

directive接受两个参数,指令的名字(字符串)和方法(这个函数返回一个对象,其中定义了指令的所有行为):函数

angular.module('myApp', [])
.directive('myDirective', function() {
  return {
    restrict: String,
    priority: Number,
    terminal: Boolean,
    template: String or Template Function:function(tElement, tAttrs) (...},
    templateUrl: String,
    replace: Boolean or String,
    scope: Boolean or Object,
    transclude: Boolean,
    controller: String or function(scope, element, attrs, transclude, otherInjectables) { ... },
    controllerAs: String,
    require: String,
    link: function(scope, iElement, iAttrs) { ... },
    compile: //// 返回一个对象或链接函数,以下所示:
      function(tElement, tAttrs, transclude) {         return {           pre: function(scope, iElement, iAttrs, controller) { ... },           post: function(scope, iElement, iAttrs, controller) { ... }         }
        //或者         return function postLink(...) { ... }       }   }; });

注:post

  1. restrict:(E元素A属性C类名M注释)ui

    restrict是一个可选的参数。它告诉AngularJS这个指令在DOM中能够何种形式被声明。默认AngularJS认为restrict的值是A,即以属性的形式来进行声明。spa

  2. priority:优先级双向绑定

    优先级参数能够被设置为一个数值。大多数指令会忽略这个参数,使用默认值0,但也有些场景设置高优先级是很是重要甚至是必须的。rest

    若是一个元素上具备两个优先级相同的指令,声明在前面的那个会被优先调用。若是其中一个的优先级更高,则无论声明的顺序如何都会被优先调用:具备更高优先级的指令老是优先运行。code

  3. terminal对象

    terminal是一个布尔型参数,能够被设置为true或false。这个参数用来告诉AngularJS中止运行当前元素上比本指令优先级低的指令。但同当前指令优先级相同的指令仍是会被执行。blog

  4. template(字符串或函数)继承

    template参数是可选的,必须被设置为如下两种形式之一:

      (1)一段HTML文本;

      (2)一个能够接受两个参数的函数,参数为tElement和tAttrs,并返回一个表明模板的字符串。tElement和tAttrs中的t表明template,是相对于instance的。在讨论连接和编译设置时会详细介绍,模板元素或属性与实例元素或属性之间的区别。

  5. templateUrl(字符串或函数)

    templateUrl是可选的参数,能够是如下类型:

      (1)一个表明外部HTML文件路径的字符串;

      (2)一个能够接受两个参数的函数,参数为tElement和tAttrs,并返回一个外部HTML文件路径的字符串。

  6. replace

    replace是一个可选参数,若是设置了这个参数,值必须为true,由于默认值为false。默认值意味着模板会被看成子元素插入到调用此指令的元素内部

  7. scope参数(布尔型或对象)

    scope参数是可选的,能够被设置为true或一个对象。默认值是false。当scope设置为true时,会从父做用域继承并建立一个新的做用域对象。

    隔离做用域:建立具备隔离做用域的指令须要将scope属性设置为一个空对象{}。若是这样作了,指令的模板就没法访问外部做用域了。

    绑定策略:使用无数据的隔离做用域并不常见,AngularJS 提供了几种方法可以将指令内的隔离做用域同外部的做用域进行数据绑定。

      本地做用域属性:使用@符号将本地做用域同DOM属性的值进行绑定。指令内部做用域能够使用外部做用域的变量:@ (or @attr);

              双向绑定:经过=能够将本地做用域上的属性同父级做用域上的属性进行双向的数据绑定。就像普通的数据绑定同样,本地属性会反映出父数据模型中所发生的改变。= (or =attr)

              父级做用域绑定 经过&符号能够对父级做用域进行绑定,以便在其中运行函数。意味着对这个值进行设置时会生成一个指向父级做用域的包装函数。& (or &attr)     

  8. transclude

    transclude是一个可选的参数。若是设置了,其值必须为true,它的默认值是false。

  9. controller(字符串或函数)

    controller参数能够是一个字符串或一个函数。当设置为字符串时,会以字符串的值为名字,来查找注册在应用中的控制器的构造函数:

相关文章
相关标签/搜索