美文网首页
angular学习之——自定义指令详解

angular学习之——自定义指令详解

作者: Lusia_ | 来源:发表于2017-02-06 14:02 被阅读56次

一、创建

var appModule = angular.module(‘app‘, []);
appModule.directive(‘hello‘, function(){
    return {
        restrict: ‘ECMA‘, //指令使用方式
        template: ‘<div>hello world.</div>‘,
        replace: true
    };
});

二、具体参数

  • restrict的取值
    * E 元素
    * C class
    * M 注释 directive:hello //一般不用
    * A 属性 默认
  • transclude
  • templateUrl
    directive里的html内容
  • link 当directive被angular 编译后,执行该方法

三、使用

<my-hello></my-hello>
<div my-hello></div>
<div class="my-hello"></div>
<my:hello></my:hello>
<my_hello></my_hello>
<data-my-hello></data-my-hello>
<x-my-hello></x-my-hello>

相关文章

网友评论

      本文标题:angular学习之——自定义指令详解

      本文链接:https://www.haomeiwen.com/subject/jbayittx.html