angularjs指令-hello指令简单用法

在慕课看大漠穷秋老师的视频，为避免时间长了忘记，写了以下笔记，没什么创新的，不喜勿喷哦
hello指令简单用法

var myModule = angular.module("MyModule",[]);
myModule.directive("hello",function(){
    return {
        restrict:'E',
        template:'
Hello everyone!
',
        replace:true
    }
});

restrict 匹配模式

<hello>hello>

<div hello>div>


<div>div>

<div class="hello">div>

注意：directive:hello与左右的注释符之间要有空格

template 模板内容
templateUrl 模板的路径

模板缓存

//注射器加载完所有模块时，run方法执行一次
myModule.run(function($templateCache){
    $templateCache.put("hello.html","
hello everyone!
");
});

template:$templateCache.get("hello.html");

replace和transclude
replace，将指令内部的内容替换

<hello><span>指令内部的内容span>hello>

最终运行结果是

transclude，可以将指令内部的内容保存，用于指令的嵌套

myModule.directive("hello",function(){
    return {
        restrict:'E',
        transclude:true,
        template:'
Hello everyone!
'
    }
});

指令中的内容会放到ng-transclude指定的位置
最终运行结果

指令执行机制：