AngularJS-指令command
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的更多相关文章
- AngularJS指令
1. AngularJS指令的特点: AngularJS通过被称为指令的新属性来扩展HTML,指令的前缀为ng-. AngularJS通过内置的指令来为应用添加功能. AngularJS允许你自定义指 ...
- angularjs指令参数transclude
angularjs指令参数transclude transclude翻译为嵌入,和之前看到的vue中的slots作用差不多,目的是将指令元素的子内容嵌入到指令的模板中 定义指令 <div sid ...
- angularjs 指令—— 绑定策略(@、=、&)
angularjs 指令—— 绑定策略(@.=.&) 引入主题背景:angular 的指令配置中的template可以直接使用硬编码写相应的代码,不过也可以根据变量,进行动态更新.那么需要用到 ...
- AngularJS 指令
AngularJS 指令 AngularJS 指令是扩展的 HTML 属性,带有前缀 ng-. ng-app 指令 ng-app 指令定义了 AngularJS 应用程序的 根元素. ng-app 指 ...
- angularjs指令(二)
最近学习了下angularjs指令的相关知识,也参考了前人的一些文章,在此总结下. 欢迎批评指出错误的地方. Angularjs指令定义的API AngularJs的指令定义大致如下 angula ...
- angularJs指令执行的机制==大概的三个阶段
第一阶段:加载阶段 angularJs要运行的话,需要去等待angular.js加载完成,加载完之后呢,angular就会去查找到ng-app这个指令,ng-app在每个应用里面只能出现一次, 它也就 ...
- AngularJS学习笔记二:AngularJS指令
AngularJS 指令: AngularJS 通过被称为 指令 的新属性来扩展 HTML. AngularJS 指令是扩展的 HTML 属性,带有前缀 ng-. 几个常用 指令: ng-app 指令 ...
- AngularJs指令(一)
AngularJs应用现在越来越流行了,谷歌都与微软合作支持AngularJS2.0,这是要逆天了,说明AngularJs将来大势所趋.最近想跳槽,又重新拾起了AngluarJs(之前由于缺少项目应用 ...
- 【转】angularjs指令中的compile与link函数详解
这篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下 通常大家在 ...
- AngularJS指令进阶 – ngModelController详解
AngularJS指令进阶 – ngModelController详解 在自定义Angular指令时,其中有一个叫做require的字段,这个字段的作用是用于指令之间的相互交流.举个简单的例子,假如我 ...
随机推荐
- ListView中加载大量的图片
情况是这样的:我需要把大约四五十个车标在一个listView中展示出来,一般在用ListView的时候撑死十来个图标,按不同分类使用,这倒好办,在创建view的时候使用R.drawable.xxx指定 ...
- python selenium2示例 - email发送
前言 在进行日常的自动化测试实践中,我们总是需要将测试过程中的记录.结果等等等相关信息通过自动的手段发送给相关人员.python的smtplib.email模块为我们提供了很好的email发送等功能的 ...
- EasyAR SDK在unity中的简单配置及构建一个简单场景。
首先打开EasyAR的官方网站http://www.easyar.cn/index.html,注册登陆之后,打开首页的开发页面. 下载sdk和Unity Samples. 创建一个unity3d工程N ...
- python 微信跳一跳进阶
上一篇是通过图片识别来计算跳的距离,再计算按压时间,最后通过adb来控制手机跳的 本篇讲的是通过机器学习,来训练的算法进行跳一跳的 链接: github:https://github.com/Prin ...
- USB设备驱动程序(二)
首先我们来看USB设备描述符的结构: 在USB总线识别设备阶段就将USB描述符发送给了USB总线驱动程序,设备的数据传输对象是端点,端点0是特殊端点,在USB总线驱动程序识别阶段, 会分配一个地址给U ...
- php之 人员的权限管理
1.想好权限管理的作用? 2.有什么权限内容? 3.既然有权限管理那么就会有管理员? 4.登录后每个人员的界面会是不一样的? 一.想好这个权限是什么? 就做一个就像是vip的功能,普通用户和vip用户 ...
- ASP.NET中指定自定义HTTP响应标头
新建一个类HideServerHeaderHelper,继承 IHttpModule,然后重写 OnPreSendRequestHeaders,Dispose,Init方法,如下代码所示 using ...
- shell 字符串处理汇总(查找,替换等等)
字符串: 简称“串”.有限字符的序列.数据元素为字符的线性表,是一种数据的逻辑结构.在计算机中可有不同的存储结构.在串上可进行求子串.插入字符.删除字符.置换字符等运算. 字符: 计算机程序设计及操作 ...
- nginx学习之web服务器(四)
1. 定义一个虚拟服务器 http { server { # Server configuration } } 可以在http {}块里面添加多个server {}块,每一个server {}块代表一 ...
- IDEA 配置Tomcat 跑Jeecg项目
最近搞了个国人开发的开源项目,还不错,记录一下踩过得坑; 首先项目开源地址 下载就可以; 准备工作作者以介绍,不再详述; 1:我使用的IDEA作为开发工具- 首先导入pom.xml,下载依赖包(此过程 ...