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. java工程中当前目录在html中的设置

    本地启动server的时候总是去读"/"的, 但到了服务器上,如果当前目录是服务器根目录下的一个文件夹,就应该设: <head> <meta charset=&q ...

  2. 驱动程序分层分离概念_总线驱动设备模型_P

    分层概念: 驱动程序向上注册的原理: 比如:输入子程序一个input.c作为一层,下层为Dev.c和Dir.c,分别编写Dev.c和Dir.c向上Input.c注册:如图所示 分离概念: 分离概念主要 ...

  3. 【BZOJ3779】重组病毒 LCT+DFS序

    [BZOJ3779]重组病毒 Description 黑客们通过对已有的病毒反编译,将许多不同的病毒重组,并重新编译出了新型的重组病毒.这种病毒的繁殖和变异能力极强.为了阻止这种病毒传播,某安全机构策 ...

  4. 6.2-SingletonBeanRegistry-DefaultSingletonBeanRegistry

    SingletonBeanRegistry package org.springframework.beans.factory.config; public interface SingletonBe ...

  5. mybatis generator的用法

    1 自动生成代码 配置数据库 自动生成三个文件: 第一,java bean文件: 第二,java bean对应的dao文件,但是这里的dao只是一个接口: 第三,mybatis需要的Mapper文件: ...

  6. 洛谷 4035 [JSOI2008]球形空间产生器

    题目戳这里 一句话题意 给你 n+1 个 n 维点,需要你求出这个n维球的球心.(n<=10) Solution 这个题目N维的话确实不好想,反正三维就已经把我搞懵了,所以只好拿二维类比. 首先 ...

  7. Jquery实现loading效果

    需要引入jquery和bootstrap相关包,然后把下面的代码复制进去就可以了: <div class="modal fade" id="loadingModal ...

  8. python+NLTK 自然语言学习处理四:获取文本语料和词汇资源

    在前面我们通过from nltk.book import *的方式获取了一些预定义的文本.本章将讨论各种文本语料库 1 古腾堡语料库 古腾堡是一个大型的电子图书在线网站,网址是http://www.g ...

  9. 聊聊数据库~5.SQL运维上篇

    1.6.SQL运维篇 运维这块逆天只能说够用,并不能说擅长,所以这篇就当抛砖之用,欢迎补充和纠错 PS:再说明下CentOS优化策略这部分的内容来源:首先这块逆天不是很擅长,所以主要是参考网上的DBA ...

  10. Gradle-jar-aar

    Ref:Android Studio系列教程 Ref:Android Studio系列教程四--Gradle基础 Ref:Intellij IDEA 14.x 中的Facets和Artifacts的区 ...