一个Demo就懂的Angular之directive
<body>
<div ng-controller="myCtrl">
<hello-word></hello-word>
</div> <script type="text/javascript">
angular.module('app',[])
.directive('hello-word',function($document){
return {
/***
'E':<hello-word></hello-word>
'A': <div hello-word ></div>
'C': <div class="hello-word: exp;"></div> Class 类名
'M': <!-- directive: hello-word exp --> Comment 注释
*/
restrict: 'E',
// templateUrl: 代表一个路径下的html片段
template: '<div>hello word!!!</div>',
//替换掉原标签
replace: true,
/**
对特定的元素注册事件。需要用到scope参数来实现dom元素的一些行为
function link(scope, element, attrs, controller) { ... }
在link阶段要执行的函数，这个属性只有当compile属性没有设置时才生效
常用参数为scope，element和attrs，分别是当前元素所在的scope，dom元素和元素上的属性们，其它的以后细说
directive基本上都会有此函数，可以注册事件，并与scope相绑 */
link: function(scope, element, attrs){
angular.element(element).bind('click',function(){
alert('hello word!!!!');
})
},
/**
想在dom渲染前对它进行变形，并且不需要scope参数
想在所有相同directive里共享某些方法，这时应该定义在compile里，性能会比较好
返回值就是link的function，这时就是共同使用的时候
*/
compile: function(){ }
}
})
.controller('myCtrl',function($scope,$location){ });
</script>
</body>
一个Demo就懂的Angular之directive的更多相关文章
- angular开发者吐槽react+redux的复杂：“一个demo证明你的开发效率低下”
曾经看到一篇文章,写的是jquery开发者吐槽angular的复杂.作为一个angular开发者,我来吐槽一下react+redux的复杂. 例子 为了让大家看得舒服,我用最简单的一个demo来展示r ...
- Android 通知栏Notification的整合 全面学习 （一个DEMO让你完全了解它）
在android的应用层中,涉及到很多应用框架,例如:Service框架,Activity管理机制,Broadcast机制,对话框框架,标题栏框架,状态栏框架,通知机制,ActionBar框架等等. ...
- 关于angular 自定义directive
关于angular 自定义directive的小结 首先我们创建一个名为"expander"的自定义directive指令: angular.module("myApp& ...
- Android 通知栏Notification的整合 全面学习 （一个DEMO让你全然了解它）
在android的应用层中,涉及到非常多应用框架.比如:Service框架,Activity管理机制,Broadcast机制,对话框框架,标题栏框架,状态栏框架.通知机制,ActionBar框架等等. ...
- 【转】 [置顶] Android 通知栏Notification的整合 全面学习 （一个DEMO让你完全了解它）
在Android的应用层中,涉及到很多应用框架,例如:Service框架,Activity管理机制,Broadcast机制,对话框框架,标题栏框架,状态栏框架,通知机制,ActionBar框架等等. ...
- Angular2 不明真相第一个Demo例子
如果不是去年换工作接触到AngularJS,估计是不会花时间去学习这个框架的,毕竟是前端的框架,不是自己熟悉的领域.但是为了混得下去,去年就学习了AngularJS的一些用法,当时还整理了一些积累 & ...
- 初识nginx之第一个demo
商城项目做了一个多月了,想到必须用到负载均衡,简单了解了一下nginx,首先分享第一个demo,五月份上线后,会继续分享一系列相关知识. 在nginx根目录下,用了一个园友的批处理文件nginx.ba ...
- springMvc的第一个demo
1.下载jar包 http://repo.spring.io/libs-release-local/org/springframework/spring/4.2.3.RELEASE/ 2.下载源码 j ...
- 如何在WTL和MFC中使用duilib及如何静态使用duilib库！（初级讲解 附带一个Demo）
关于duilib的历史,我也就不多说了,能看到这篇文章的人都是有一定了解才能找到这个的. 我直接说下对这个库的基本使用吧. 我个人对一些好技术都是比较感兴趣的. 因为个人原因 喜欢接触一个好技术. 所 ...
随机推荐
- poj3273 二分
Monthly Expense Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 21448 Accepted: 8429 ...
- hdu 1263 水果
Problem Description 夏天来了~~好开心啊,呵呵,好多好多水果~~ Joe经营着一个不大的水果店.他认为生存之道就是经营最受顾客欢迎的水果.现在他想要一份水果销售情况的明细表,这样J ...
- c#按键Up和Down对Textbox的内容加1减1
private void textBox_proc1value_KeyDown(object sender, KeyEventArgs e) { Keys key = e.KeyCode; if (e ...
- 有关SetTimer函数的用法
1 )用WM_TIMER来设置定时器 先请看SetTimer这个API函数的原型 UINT_PTR SetTimer( HWND hWnd, // 窗口句柄 UINT_PTR nIDEvent, // ...
- Session与Cookie间不得不说的一些事
在很久很久以前,刚有浏览器和网页的时候,web开发者发现了一个问题,我必须要在客户端这边保存一些东西才能实现某些功能,比如大家喜闻乐见的购物车.用户登录.自动登陆等.但是客户端只有一个浏览器,怎么在用 ...
- 01--从根源种子CCNode说起
CCNode作为渲染框架的基类(暂且这样理解,CCObject为引擎基类)其中定义了绘制游戏元素相关的属性以及相关方法.属性当中需要注意的一个是Z坐标,在渲染框架中用来表示元素的遮挡关系,其值越小越容 ...
- PHP命名空间(Namespace)的使用详解(转)
对于命名空间,官方文档已经说得很详细[查看],我在这里做了一下实践和总结. 命名空间一个最明确的目的就是解决重名问题,PHP中不允许两个函数或者类出现相同的名字,否则会产生一个致命的错误.这种情况下只 ...
- 鼠标悬停移除更换class
$("#xinl").mouseover(function() //鼠标悬停执行函数 { $(".xl").removeClass().addClass(&q ...
- HttpAsyncClient 的简单使用
下载地址:http://hc.apache.org/downloads.cgi 在NetBeans中导入以下jar文件: 1:一次请求: public static void oneReuest(){ ...
- POJ 3675 Telescope
题意:给定一个不自交的多边形,要求和圆心在原点的圆的面积交. 思路:同POJ2986,是加强版 代码: #include<algorithm> #include<cstdio> ...