AngularJS 自定义指令directive 介绍

---------------------------------------------------------------------------
指令的作用是把我们自定义的语义化标签替换成浏览器能够认识的HTML标签。
指令
link: function (scope, element, attrs, accordionController) {
(1)$scope,与指令元素相关联的作用域
(2)$element,当前元素 ,例如<p> 元素//从元素列表中获取元素,并绑定相应的事件
(3)$attrs,由当前元素的属性对象
(4)$transclude,嵌入链接函数,实际被执行用来克隆元素和操作DOM的函数
举例如下,你可以进行对照理解:
var expModule=angular.module('expanderModule',[])
expModule.directive('accordion', function() {
return {
restrict : 'EA',
replace : true,
transclude : true,
template : '<div ng-transclude></div>',
controller : function() {
var expanders = [];
this.gotOpened = function(selectedExpander) {
angular.forEach(expanders, function(expander) {
if (selectedExpander != expander) {
expander.showMe = false;
}
});
}
this.addExpander = function(expander) {
expanders.push(expander);
}
}
}
});
--------------------------------------------------------------------------------------------------------------

如果还是不太能理解可以看这个链接,这里比较详细,也写的不错http://blog.csdn.net/kongjiea/article/details/49840035
AngularJS 自定义指令directive 介绍的更多相关文章
- angularjs自定义指令Directive
今天学习angularjs自定义指令Directive.Directive是一个非常棒的功能.可以实现我们自义的的功能方法. 下面的例子是演示用户在文本框输入的帐号是否为管理员的帐号"Adm ...
- angularjs - 自定义指令(directive)
自定义指令(directive) 使用 .directive 函数来添加自定义的指令. 要调用自定义指令,HTML 元素上需要添加自定义指令名. 例子:使用驼峰法来命名一个指令, demoDirect ...
- AngularJS自定义指令directive:scope属性 (转载)
原文地址:http://blog.csdn.net/VitaLemon__/article/details/52213103 一.介绍: 在AngularJS中,除了内置指令如ng-click等,我们 ...
- angularJs自定义指令.directive==类似自定义标签
创建自定义的指令 除了 AngularJS 内置的指令外,我们还可以创建自定义指令. 你可以使用 .directive 函数来添加自定义的指令. 要调用自定义指令,HTML 元素上需要添加自定义指令名 ...
- angularjs 一篇文章看懂自定义指令directive
壹 ❀ 引 在angularjs开发中,指令的使用是无处无在的,我们习惯使用指令来拓展HTML:那么如何理解指令呢,你可以把它理解成在DOM元素上运行的函数,它可以帮助我们拓展DOM元素的功能.比如 ...
- 浅析AngularJS自定义指令之嵌入(transclude)
AngularJS自定义指令的嵌入功能与vue的插槽十分类似,都可以实现一些自定义内容展现.在开始之前先简单介绍下自定义指令的transclude属性和AngularJS的内置指令ng-transcl ...
- AngularJs自定义指令详解(1) - restrict
下面所有例子都使用angular-1.3.16.下载地址:http://cdn.bootcss.com/angular.js/1.3.16/angular.min.js 既然AngularJs快要发布 ...
- AngularJS: 自定义指令与控制器数据交互
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- angularJs 自定义指令传值---父级与子级之间的通信
angularJs自定义指令用法我忽略,之前有写过,这里只说一下父子级之间如何传值: 例如: 模块我定义为myApp,index.html定义 <my-html bol-val="bo ...
随机推荐
- unity项目git管理
Unity设置 (关键) Edit -> Project Settings -> Editor -> Version Control Mode 开启 Visible Meta Fil ...
- winform从table1获取需要的数据转存储到table2中
小技术一个,记录一下 ,以下记录的是用两种方式来实现,数据表的转移 table转存数据之前首先要明确两个函数: Add():是指在最后一行添加一行 InsertAt():可以插入到表中的指定行 需求: ...
- nodejs应用离线安装部署、卸载
公司写的文档,直接粘贴过来了: 本文档提供node应用一键安装.部署.卸载说明,包含对应脚本文件 默认版本:1.nodejs:v6.11.2.linux-x642.全局npm包:pm2.supervi ...
- 陆续放给大家一些拿钱买的收费的模板,今天先给一个在某销售网站上排行第一的管理端模板 Ace Responsive Admin Template
下载地址: http://pan.baidu.com/s/1B2xjC 提取密码:le1p 原文地址:http://zhangrou.net/post/2014/06/23/陆续放给大家一些拿钱买的收 ...
- 四、cent OS安装配置mysql
下载mysql的repo源wget http://repo.mysql.com/mysql-community-release-el7-5.noarch.rpm 安装mysql-community-r ...
- POJ 2524(并查集)
这道题多了一个检查是否包含所有元素 可以设一个cnt表示集合里的数量,再与外面比较 #include <cstdio> #include <iostream> #include ...
- BZOJ3600:没有人的算术
传送门 如果能给每个 \(pair\) 按照权值编号就好了 假设之前已经有了所有的权值的编号,现在考虑编号新的 \(pair\) 如果看过了陈立杰的论文的话,不难得到一个重量平衡树的做法 给树上每个子 ...
- bitset(01串)优化
bitset的经典使用: 见代码及注释: #include<bitset> #include<algorithm> using namespace std; //只需调用< ...
- js中变量声明有var和没有var的区别
转js中var用与不用的区别 2015年07月13日 16:08:22 阅读数:3627 Javascript声明变量的时候,虽然用var关键字声明和不用关键字声明,很多时候运行并没有问题,但是这两种 ...
- js中作用域链和作用域
作用域 在JavaScript中,我们可以将作用域定义为一套规则,这套规则用来管理引擎如何在当前作用域以及嵌套的子作用域中根据标识符名称(变量名或者函数名)进行变量查找. 经过研究<高级程序设计 ...