AngularJS: 自定义指令与控制器数据交互
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>AngularJS自定义指令与控制器数据交互</title>
<!-- <script src="http://cdn.bootcss.com/angular.js/1.3.15/angular.js"></script>-->
<script src="../../lib/angular/angular.js"></script>
<script> angular.module('yyApp', [])
.controller('yyHelloController', function($scope){
$scope.data = {
name: '张三'
}
})
.controller('yyHelloController2', function($scope){
$scope.data = {
name: '李四'
}
})
.directive('yyHello', function(){
return{
restrict: 'AE',
replace: true,
template: '<div name="{{data.name}}">你好,{{data.name}}</div>'
};
}); </script>
</head>
<body ng-app='yyApp'>
<yy-hello ng-controller='yyHelloController'></yy-hello>
<div ng-controller='yyHelloController2'>
<input type="text" ng-model='data.name'>
<yy-hello></yy-hello>
</div>
</body>
</html>
AngularJS: 自定义指令与控制器数据交互的更多相关文章
- angularjs自定义指令Directive
今天学习angularjs自定义指令Directive.Directive是一个非常棒的功能.可以实现我们自义的的功能方法. 下面的例子是演示用户在文本框输入的帐号是否为管理员的帐号"Adm ...
- AngularJs自定义指令详解(1) - restrict
下面所有例子都使用angular-1.3.16.下载地址:http://cdn.bootcss.com/angular.js/1.3.16/angular.min.js 既然AngularJs快要发布 ...
- 浅析AngularJS自定义指令之嵌入(transclude)
AngularJS自定义指令的嵌入功能与vue的插槽十分类似,都可以实现一些自定义内容展现.在开始之前先简单介绍下自定义指令的transclude属性和AngularJS的内置指令ng-transcl ...
- angularJs 自定义指令传值---父级与子级之间的通信
angularJs自定义指令用法我忽略,之前有写过,这里只说一下父子级之间如何传值: 例如: 模块我定义为myApp,index.html定义 <my-html bol-val="bo ...
- AngularJs自定义指令详解(6) - controller、require
在前面文章中提到一旦声明了require,则链接函数具有第四个参数:controller. 可见require和controller是配合使用的. 在自定义指令中使用controller,目的往往是要 ...
- angularJS——自定义指令
主要介绍指令定义的选项配置 //angular指令的定义,myDirective ,使用驼峰命名法 angular.module('myApp', []) .directive('myDirectiv ...
- AngularJs自定义指令详解(5) - link
在指令中操作DOM,我们需要link参数,这参数要求声明一个函数,称之为链接函数. 写法: link: function(scope, element, attrs) { // 在这里操作DOM} 如 ...
- 利用angularJs自定义指令(directive)实现在页面某一部分内滑块随着滚动条上下滑动
最近老大让我一个效果实现在页面某一部分内滑块随着滚动条上下滑动,说明一下我们项目使用技术angularJs.大家都知道,使用jquery很好实现. 那么angular如何实现呢,我用的是自定义指令(d ...
- angularJs自定义指令(directive)实现滑块滑动
最近老大让我一个效果实现在页面某一部分内滑块随着滚动条上下滑动,说明一下我们项目使用技术angularJs.大家都知道,使用jquery很好实现. 那么angular如何实现呢,我用的是自定义指令(d ...
随机推荐
- Excel中如何查找并列出所有链接(外部数据链接)?
在 Excel 中,有时会需要创建外部链接来引用其他工作簿的单元格内容,但是如果想要找出所有链接并且还要将这些外部数据链接列在一个工作簿当中是有点难度的.下面我会介绍一些快捷方法,不仅能够快速帮你找出 ...
- linux 通用时钟框架CCF
linux CCF 时钟框架 简单介绍 这里讲的时钟是给soc各组件提供时钟的树状框架,并非内核使用的时间,和其它模块一样,clk也有框架,用以适配不同的平台.适配层之上是客户代码和接口,也就是各模块 ...
- thinkphp实现模糊匹配(学习贵哥代码)
模板文件: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...
- Exploring Message Brokers: RabbitMQ, Kafka, ActiveMQ, and Kestrel--reference
[This article was originally written by Yves Trudeau.] http://java.dzone.com/articles/exploring-mess ...
- JDBC学生管理系统--处理分页显示
分页的思想: 假设一共有104条数据,每页显示10条数据: select * from student limit 0,10; 页数是index,第index页,对应的sql语句是: select * ...
- [转]cookie、session、sessionid 与jsessionid
cookie.session.sessionid 与jsessionid,要想明白他们之间的关系,下面来看个有趣的场景来帮你理解. 我们都知道银行,银行的收柜台每天要接待客户存款/取款业务,可以有几种 ...
- Linux强制踢出登录用户(断线账户剔除)
首先,用w查看登录用户 :: up days, :, users, load average: 1.00, 1.01, 1.00 USER TTY FROM LOGIN@ IDLE JCPU PCPU ...
- Caused by: java.lang.ClassNotFoundException: com/sun/tools/internal/xjc/api/XJC
Caused by: java.lang.ClassNotFoundException: com/sun/tools/internal/xjc/api/XJC 缺少com/sun/tools/inte ...
- C# QRCode、DataMatrix和其他条形码的生成和解码软件
今天制造了一个C#的软件,具体是用于生成二维码和条形码的,包括常用的QRCode.DataMatrix.Code128.EAN-8等等. 使用的第三方类库是Zxing.net和DataMatrix.n ...
- 今天把PHP复习了一下.
记录一下今天复习内容. $_GET[''] $_POST $_SESSION $_COOKIE 常用的 $var='a'; global 全局变量$GLOBALS[''] $$var (动态变量名的变 ...