正文
angular.js之作用域scope'@','=','&'
小程序:扫一扫查出行
【扫一扫了解最新限行尾号】
复制小程序
【扫一扫了解最新限行尾号】
复制小程序
<!doctype html>
<html ng-app='myApp'>
<head>
</head>
<body>
<script src="http://cdn.bootcss.com/angular.js/1.4.6/angular.js"></script>
<script src="https://cdn.bootcss.com/jquery/1.8.3/jquery.js"></script>
<div ng-controller="listCtrl" ng-app="myApp">
<input type="text" ng-model="color">
<!-- <span kid hd-color="color"></span> --> <!--@是单项数据绑定,hd-color="{{color}}"作用域隔离,在view中是以模板“{{}}”的形式;=双向绑定,hd-color="color",在view中直接以属性的形式出现-->
<div kid color="callback()"></div>
</div>
<script type="text/javascript">
var myApp=angular.module('myApp',[]);
myApp.controller('listCtrl',function($scope){
$scope.color="red";
$scope.callback=function(){
return 'a web developer !';
}
});
myApp.directive('kid',function(){
return {
restrict:'AE',
//template:'<div style="color:{{color}}">@符号的学习</div>' ,
template:'<h1>{{color()}}</h1>',
scope:{ /*color:"=hdColor"*//* "@hdColor" */color:'&'} //通过&属性名来调用控制器的函数
}
});
</script>
</div>
</body>
</html>
angular.js之作用域scope'@','=','&'的更多相关文章
-
Angular JS 学习之 Scope作用域
1.Scope作用域是应用在HTML(视图)和JavaScript(控制器)之间的纽带: Scope是一个对象,有可用的方法和属性: Scope可应用在视图和控制器上: 2.当你在AngularJS中 ...
-
学习angular.js的一些笔记想法(上)
1.data-ng-app与ng-app的区别 data-ng-app是为了h5不报错 2.ng-class 不多说就来拿例子说吧 html代码 <div class='color-change ...
-
python , angular js 学习记录【1】
1.日期格式化 Letter Date or Time Component Presentation Examples G Era designator Text AD y Year Year 199 ...
-
angular js 的 ng-keyup 监听 keydown keyup事件获取 keyCode
参考这个页面.http://www.angularjshub.com/examples/eventhandlers/keyboardevents/ Html页面代码: <input ng-mod ...
-
angular.js 中同步视图和模型数据双向绑定,$watch $digest $apply 机制
Angular.js 中的特性,双向绑定. 让视图的改变直接反应到数据中,数据的改变又实时的通知到视图,如何做到的? 这要归功于 scope 下面3个重要的方法: $watch $digest $ap ...
-
Angular.js回想+学习笔记(1)【ng-app和ng-model】
Angular.js中index.html简单结构: <!doctype html> <html ng-app> <head> <script src=&qu ...
-
angular js 指令的数据传递 及作用域数据绑定
<div my-directive my-url="http://google.com" my-link-text="Click me to go to Googl ...
-
angular.js 中的作用域 数据模型 控制器
1.angular.js 作为后起之秀的前端mvc框架,他于传统的前端框架都不同,我们再也不需要在html中嵌入脚本来操作对象了.它抽象出了数据模型,控制器及视图. 成功解耦了应用逻辑,数据模型,视图 ...
-
Angular JS - 4 - Angular JS 作用域与控制器对象
1. 控制器对象使用 <!DOCTYPE html> <html> <head lang="en"> <meta charset=&quo ...
随机推荐
-
Linux - tomcat -jndi数据源配置
Linux - tomcat -jndi数据源配置 tomcat/conf/context .xml 文件中修改如下 <Resource name="/jdbc/--" au ...
-
java系列--JSP的属性和内置对象
一.JSP指令: <%@ 指令名 属性=" " %> 1.page指令 import属性 errorPage属性 language属性 session属性 isErro ...
-
php 特别的函数
call_user_func函数和call_user_func_array函数 set_include_path
-
iOS 程序开发
准备 iOS 开发 之 编程知识点 iOS 程序调试 iOS 之 OC开发实战 iOS 架构模式 iOS 之 新功能.扩展
-
关于老版本ubuntu源不能用的问题
在解决方向键为大写ABCD时安装vim 我的是Ubuntu 10.10 老版本 输入 sudo apt-get install vim 时出现 Package 'vim' has no install ...
-
swift 画图 Charts的基本使用
下面的这些代码呢是在oc工程里里使用的 其实和在swift中使用没什么大的差别 属性都一样的 //创建饼状图 self.pieChartView = [[PieChartView alloc] ...
-
spring mvc 下载文件链接
http://www.blogjava.net/paulwong/archive/2014/10/29/419177.html http://www.iteye.com/topic/1125784 h ...
-
SimpleDateFormat解析的时候字符串过长问题
竟然不会报错: try { SimpleDateFormat dateFormatFrom = new SimpleDateFormat("yyyyMMddHHmmss"); St ...
-
ZXing 生成、解析二维码图片的小示例
概述 ZXing 是一个开源 Java 类库用于解析多种格式的 1D/2D 条形码.目标是能够对QR编码.Data Matrix.UPC的1D条形码进行解码. 其提供了多种平台下的客户端包括:J2ME ...
-
【费式数列(Fibonacci数列)】
/* 说明: Fibonacci为1200年代的欧洲数学家,在他的着作中曾经提到:若有一只兔子每个月生一只小兔子,一个月后也开 始生产.起初只有一只兔子,一个月后就有两只兔子,二个月后就有三只兔子,三 ...
1.Scope作用域是应用在HTML(视图)和JavaScript(控制器)之间的纽带: Scope是一个对象,有可用的方法和属性: Scope可应用在视图和控制器上: 2.当你在AngularJS中 ...
1.data-ng-app与ng-app的区别 data-ng-app是为了h5不报错 2.ng-class 不多说就来拿例子说吧 html代码 <div class='color-change ...
1.日期格式化 Letter Date or Time Component Presentation Examples G Era designator Text AD y Year Year 199 ...
参考这个页面.http://www.angularjshub.com/examples/eventhandlers/keyboardevents/ Html页面代码: <input ng-mod ...
Angular.js 中的特性,双向绑定. 让视图的改变直接反应到数据中,数据的改变又实时的通知到视图,如何做到的? 这要归功于 scope 下面3个重要的方法: $watch $digest $ap ...
Angular.js中index.html简单结构: <!doctype html> <html ng-app> <head> <script src=&qu ...
<div my-directive my-url="http://google.com" my-link-text="Click me to go to Googl ...
1.angular.js 作为后起之秀的前端mvc框架,他于传统的前端框架都不同,我们再也不需要在html中嵌入脚本来操作对象了.它抽象出了数据模型,控制器及视图. 成功解耦了应用逻辑,数据模型,视图 ...
1. 控制器对象使用 <!DOCTYPE html> <html> <head lang="en"> <meta charset=&quo ...
-
Linux - tomcat -jndi数据源配置
Linux - tomcat -jndi数据源配置 tomcat/conf/context .xml 文件中修改如下 <Resource name="/jdbc/--" au ...
-
java系列--JSP的属性和内置对象
一.JSP指令: <%@ 指令名 属性=" " %> 1.page指令 import属性 errorPage属性 language属性 session属性 isErro ...
-
php 特别的函数
call_user_func函数和call_user_func_array函数 set_include_path
-
iOS 程序开发
准备 iOS 开发 之 编程知识点 iOS 程序调试 iOS 之 OC开发实战 iOS 架构模式 iOS 之 新功能.扩展
-
关于老版本ubuntu源不能用的问题
在解决方向键为大写ABCD时安装vim 我的是Ubuntu 10.10 老版本 输入 sudo apt-get install vim 时出现 Package 'vim' has no install ...
-
swift 画图 Charts的基本使用
下面的这些代码呢是在oc工程里里使用的 其实和在swift中使用没什么大的差别 属性都一样的 //创建饼状图 self.pieChartView = [[PieChartView alloc] ...
-
spring mvc 下载文件链接
http://www.blogjava.net/paulwong/archive/2014/10/29/419177.html http://www.iteye.com/topic/1125784 h ...
-
SimpleDateFormat解析的时候字符串过长问题
竟然不会报错: try { SimpleDateFormat dateFormatFrom = new SimpleDateFormat("yyyyMMddHHmmss"); St ...
-
ZXing 生成、解析二维码图片的小示例
概述 ZXing 是一个开源 Java 类库用于解析多种格式的 1D/2D 条形码.目标是能够对QR编码.Data Matrix.UPC的1D条形码进行解码. 其提供了多种平台下的客户端包括:J2ME ...
-
【费式数列(Fibonacci数列)】
/* 说明: Fibonacci为1200年代的欧洲数学家,在他的着作中曾经提到:若有一只兔子每个月生一只小兔子,一个月后也开 始生产.起初只有一只兔子,一个月后就有两只兔子,二个月后就有三只兔子,三 ...