angularjs自定义指令
my-directive为指令名称,thisdata为绑定的数据 <span ng-repeat="act in move.casts" style="position:relative">
<my-directive thisdata="act">
</my-directive>
<img src="" alt="" class="pic" >
</span>
app.directive('myDirective',function(){
return {
restrict:'EA',
template:'<span>{{thisdata.name}}</span>', //thisdata表示act
scope:{
thisdata:"=" //"="表示双向绑定数据
},
replace:false,
link:function (scope,element,attr) { //scope一个自定义的子作用域,element表示当前控制的元素
element.mouseenter(function () {
this.nextSibling.nextSibling.src=scope.thisdata.avatars.small;
});
element.mouseleave(function(){
this.nextSibling.nextSibling.src="";
});
}
}
});
//自定义指令的3种绑定策略
“@”与父级作用域进行单项绑定
“=”与父级作用域进行双向绑定
“&”将子作用域与父作用域的方法进行绑定,子作用域可以使用父作用域的方法
angularjs自定义指令的更多相关文章
- 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自定义指令之嵌入(transclude)
AngularJS自定义指令的嵌入功能与vue的插槽十分类似,都可以实现一些自定义内容展现.在开始之前先简单介绍下自定义指令的transclude属性和AngularJS的内置指令ng-transcl ...
- angularjs自定义指令Directive
今天学习angularjs自定义指令Directive.Directive是一个非常棒的功能.可以实现我们自义的的功能方法. 下面的例子是演示用户在文本框输入的帐号是否为管理员的帐号"Adm ...
- angularJs 自定义指令传值---父级与子级之间的通信
angularJs自定义指令用法我忽略,之前有写过,这里只说一下父子级之间如何传值: 例如: 模块我定义为myApp,index.html定义 <my-html bol-val="bo ...
- AngularJs自定义指令详解(6) - controller、require
在前面文章中提到一旦声明了require,则链接函数具有第四个参数:controller. 可见require和controller是配合使用的. 在自定义指令中使用controller,目的往往是要 ...
- angularJs自定义指令.directive==类似自定义标签
创建自定义的指令 除了 AngularJS 内置的指令外,我们还可以创建自定义指令. 你可以使用 .directive 函数来添加自定义的指令. 要调用自定义指令,HTML 元素上需要添加自定义指令名 ...
- angularJS——自定义指令
主要介绍指令定义的选项配置 //angular指令的定义,myDirective ,使用驼峰命名法 angular.module('myApp', []) .directive('myDirectiv ...
- AngularJS自定义指令(Directives)在IE8下的一个坑
在项目中,由于要兼容到IE8,我使用1.2.8版本的angularJS.这个版本是支持自定义指令的.我打算使用自定义指令将顶部的header从其他页面分离.也就是实现在需要header的页面只用在&l ...
- 利用angularJs自定义指令(directive)实现在页面某一部分内滑块随着滚动条上下滑动
最近老大让我一个效果实现在页面某一部分内滑块随着滚动条上下滑动,说明一下我们项目使用技术angularJs.大家都知道,使用jquery很好实现. 那么angular如何实现呢,我用的是自定义指令(d ...
随机推荐
- 在eclipse上开发nodejs
首先到官网下载nodejs.地址:https://nodejs.org/en,可根据自己的操作系统选择下载. 安装好后.进入命令行输入node ,然后输入console.log("hello ...
- YbSoftwareFactory 代码生成插件【十八】:树形结构下的查询排序的数据库设计
树形结构的排序在中国特色下十分普遍也非常重要,例如常说的五大班子,党委>人大>政府>政协>纪委,每个班子下还有部门,岗位,人员,最终排列的顺序通常需要按权力大小.重要性等进行排 ...
- 关于strlen误用的一点记录
今天帮一个朋友查一个错误,是运行时报vector iterator incompatible,一般这种问题是向量和迭代器的类型不兼容,或者是进行迭代器判等时前后向量的结构发生变化,如erase操作之后 ...
- 仿网易新闻 ViewPager 实现图片自动轮播
新闻 App 首页最上方一般会循环播放热点图片,如下图所示. 本文主要介绍了利用 ViewPager 实现轮播图片,图片下方加上小圆点指示器标记当前位置,并利用 Timer+Handler 实现了自动 ...
- mysq 性能分析利器
poor man’sprofiler 在Percona Toolkit 中我们也开发了一个类似的穷人剖析器,叫做pt-pmp
- FFmpeg相关资料
编译: http://www.jianshu.com/p/147c03553e63 http://www.cocoachina.com/ios/20150514/11827.html http://c ...
- Eclipse创建maven项目
许久不创建maven web项目了,今天上手很是陌生,搜集资料后终于创建成功,跟大家也分享一下,同时也便于以后再次忘记使用... 新建maven项目(右击new,若不存在,可在other里面寻找)
- 亚马逊EC2弹性IP收费
刚收到亚马逊云账单,被扣了4.44刀,吓尿,麻溜的去查账单详情,发现之前弃用的美国实例有个弹性IP没释放掉,占着茅坑还不拉屎,被扣钱宝宝无话可说,赶紧释放... $0.005 per Elastic ...
- SpringMVC框架下的异常处理
在eclipse的javaEE环境下:导包.... 1. 在 @ExceptionHandler 方法的入参中可以加入 Exception 类型的参数, 该参数即对应发生的异常对象 2. @Excep ...
- 利用opencv训练样本分类
参考:http://www.cnblogs.com/easymind223/archive/2012/07/03/2574826.html http://www.tuicool.com/article ...