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 ...
随机推荐
- PhpStorm设置编码
PhpStorm是一个轻量级且便捷的PHP IDE,其旨在提供用户效率,可深刻理解用户的编码,提供智能代码补全,快速导航以及即时错误检查. 本文为大家讲解的是如何设置phpstorm 编辑器的编码,感 ...
- asp.net 事件加载顺序
下面是母版页与内容页合并后事件的发生顺序: 母版页控件 Init 事件. 内容控件 Init 事件. 母版页 Init 事件. 内容页 Init 事件. 内容页 Load 事件. 母版页 Load 事 ...
- Dashborad 上显示出错
Dashboard 上显示的错误是因为没有选择对应的X-坐标. 上周处理过 一个字段,它是一个Formula 字段,作为Dashboard的 Data Source 前提是报表是得Group by 一 ...
- 利用Maven打包时,如何包含更多的资源文件
首先,来看下MAVENx项目标准的目录结构: 一般情况下,我们用到的资源文件(各种xml,properites,xsd文件等)都放在src/main/resources下面,利用maven打包时,ma ...
- Sql Server 中一个非常强大的日期格式化函数
Sql Server 中一个非常强大的日期格式化函数Select CONVERT(varchar(100), GETDATE(), 0)-- 05 16 2006 10:57AMSelect CONV ...
- Windows光标形状
::SetCursor( LoadCursor(NULL, IDC_XXX) ); IDC_ARROW (plain) IDC_HELP (arrow + question mark) IDC_APP ...
- Mark Down 尝试
Hello World iawriter sublime text
- Git 命令清单
这份命令清单并不完善,后期会根据使用情况再进行更改. 操作分支项目 1 下载仓库的一个分支(baooab-patch-1)的代码 git clone -b baooab-patch-1 https:/ ...
- tinkphp登录验证码的使用
登录和验证(控制器) <?php namespace Come\Controller; use Think\Controller; class RenController extends Con ...
- SqlServer 递归查询树形数据
一直没有在意过数据库处理树形数据的重要性,直到有一天朋友问起我关于树形数据查询的问题时才发现根本不会,正好这个时候也要用到递归进行树形数据的查询于是在网上查了一圈,语法总结如下 参考文献:https: ...