directive:

匹配模式restrict:'AEMC'默认为A

template

templateUrl

templateCache:把模板缓存起来,共多个指令使用

var myModule = angular.module("MyModule", []);

//注射器加载完所有模块时,此方法执行一次
myModule.run(function($templateCache){
$templateCache.put("hello.html","<div>Hello everyone!!!!!!</div>");
}); myModule.directive("hello", function($templateCache) {
return {
restrict: 'AECM',
template: $templateCache.get("hello.html"),
replace: true
}
});

replace:

transclude:指令互相嵌套

独立scope

scope:{}

var myModule = angular.module("MyModule", []);
myModule.directive("hello", function() {
return {
restrict: 'AE',
scope:{},
template: '<div><input type="text" ng-model="userName"/>{{userName}}</div>',
replace: true
}
});

绑定策略

内置指令63:

compile&&link:

加载angular.js,找到ng-app指令,确定应用边界

遍历DOM,找到所有指令

根据指令代码的template,replace,transclue转换DOM结构

连接阶段

对每一条指令运行link函数

link函数一般用来操作DOM、绑定事件监听器。

AngularJS-指令command的更多相关文章

  1. AngularJS指令

    1. AngularJS指令的特点: AngularJS通过被称为指令的新属性来扩展HTML,指令的前缀为ng-. AngularJS通过内置的指令来为应用添加功能. AngularJS允许你自定义指 ...

  2. angularjs指令参数transclude

    angularjs指令参数transclude transclude翻译为嵌入,和之前看到的vue中的slots作用差不多,目的是将指令元素的子内容嵌入到指令的模板中 定义指令 <div sid ...

  3. angularjs 指令—— 绑定策略(@、=、&)

    angularjs 指令—— 绑定策略(@.=.&) 引入主题背景:angular 的指令配置中的template可以直接使用硬编码写相应的代码,不过也可以根据变量,进行动态更新.那么需要用到 ...

  4. AngularJS 指令

    AngularJS 指令 AngularJS 指令是扩展的 HTML 属性,带有前缀 ng-. ng-app 指令 ng-app 指令定义了 AngularJS 应用程序的 根元素. ng-app 指 ...

  5. angularjs指令(二)

    最近学习了下angularjs指令的相关知识,也参考了前人的一些文章,在此总结下. 欢迎批评指出错误的地方.   Angularjs指令定义的API AngularJs的指令定义大致如下 angula ...

  6. angularJs指令执行的机制==大概的三个阶段

    第一阶段:加载阶段 angularJs要运行的话,需要去等待angular.js加载完成,加载完之后呢,angular就会去查找到ng-app这个指令,ng-app在每个应用里面只能出现一次, 它也就 ...

  7. AngularJS学习笔记二:AngularJS指令

    AngularJS 指令: AngularJS 通过被称为 指令 的新属性来扩展 HTML. AngularJS 指令是扩展的 HTML 属性,带有前缀 ng-. 几个常用 指令: ng-app 指令 ...

  8. AngularJs指令(一)

    AngularJs应用现在越来越流行了,谷歌都与微软合作支持AngularJS2.0,这是要逆天了,说明AngularJs将来大势所趋.最近想跳槽,又重新拾起了AngluarJs(之前由于缺少项目应用 ...

  9. 【转】angularjs指令中的compile与link函数详解

    这篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下   通常大家在 ...

  10. AngularJS指令进阶 – ngModelController详解

    AngularJS指令进阶 – ngModelController详解 在自定义Angular指令时,其中有一个叫做require的字段,这个字段的作用是用于指令之间的相互交流.举个简单的例子,假如我 ...

随机推荐

  1. js判断对象的属性是原型的还是实例的

    一些情况下,我们需要知道对象的属性是原型的还是实例的,如果看代码的话比较繁琐,下面讲解下如何可以直接判断 1.hasOwnProperty()函数用于指示一个对象自身(不包括原型链)是否具有指定名称的 ...

  2. angualejs

    http://segmentfault.com/a/1190000000347412 http://www.xker.com/page/e2015/06/199141.html http://www. ...

  3. 查看文档的后几行命令:tail

    假如有一个文件test.txt,内容如下: [root@lee ~]# cat test.txt 这是第1行 这是第2行 这是第3行 这是第4行 这是第5行 这是第6行 这是第7行 这是第8行 这是第 ...

  4. MySQL的基本操作--第一弹

    前言:在听许嵩,忆当年,意气风发 ———————————————————————————————————————————————— 好了,今天和大家同步讲解mysql的知识了.都是最基本的知识. 一. ...

  5. Lumen开发:lumen源码解读之初始化(3)——单例(singleton)与中间件(Middleware)

    版权声明:本文为博主原创文章,未经博主允许不得转载. 今天来讲讲Lumen的singleton和Middleware,先来看看起始文件bootstrap/app.php / * | --------- ...

  6. lua(简单的传参)

    #include <iostream> #include <string.h> extern "C" { /*头文件lua.h定义了Lua提供的基础函数,包 ...

  7. poj2349

    Arctic Network Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 0   Accepted: 0 Descript ...

  8. 物理cpu和逻辑cpu

    1 物理cpu 插槽里面实际插入的cpu的个数. 通过不重复的physical id可以获取实际的物理cpu的个数. 2 逻辑cpu cat /proc/info processor 1 proces ...

  9. Django安装debug tool bar

    1.安装Django Debug Toolbarpip install django-debug-toolbar 2.设置项目的DEBUG属性DEBUG = True 3.INSTALLED_APPS ...

  10. java实现数字的反转

    例如有一个数字是:19911002,要求是,我要得到它的反转后的数:20011991 实现如下: static void reverse(int a) { int rs = 0; while (a & ...