angular directive scope
angular directive scope
1.当directive 中不指定scope属性,则该directive 直接使用 app 的scope;
2.当directive 中指定scope属性时,scope作用域有3种方式:
2.1 . = : 代表数据双向绑定,只要该属性发生改变 ,app(即父作用域) 中scope对应的值和 directive中对应的值将同时发生改变 ;
2.2 . @ : 代表数据单向绑定,该值的改变只会影响directive ,不会影响app(即父作用域) 其他值, 也就是孤立作用域 ;
2.3 . & :代表继承或者使用父作用域中scope绑定的方法。
下面用一个demo 来说明:
example:
directive html:
<gmb-per say="myalert()" abc="gmbPerNotification_d">gmb-per</gmb-per>
coffee directive code :
# module
angular.module('demo',[])
.controller 'myCtrl',($scope)->
$scope.gmbPerNotification_d = [1,2,3]
$scope.myalert = ->
alert(11)
#directive
pushNotificationApp.directive 'gmbPer',($timeout,$compile) ->
restrict: 'AE'
#terminal : true
transclude : true
#replace : true
template:'<div class="col-lg-4 chartWrap" ng-click="say()" ng-repeat="perN in abc">121212</div>'
#replace : true
scope:
abc : '='
gmbPerNotification_d : '='
say : '&'
controller : ($scope) -> #$scope.mytest = [1,2] link : (scope, element, attrs) -> console.log
angular directive scope的更多相关文章
- angular之scope详解
AngularJS的一些指令会创建子作用域,而子作用域会继承自父作用域,大致可分为以下3种 1.创建子作用域并继承父作用域的指令 ng-repeat ng-include ng-switch ng-c ...
- angular directive 深入理解
由于业务的需要,最近angular 的diretive 研究的比较多,有和同事一起共同协作开发scada的项目, 对directive 有了进一步更深的理解. 感觉才开始真正理解了这句话的意思: In ...
- ANGULARJS: UNDERSTANDING DIRECTIVE SCOPE
https://www.3pillarglobal.com/insights/angularjs-understanding-directive-scope --------------------- ...
- angularjs中的directive scope配置
angularjs中的directive scope配置 定义directive其中重要的一环就是定义scope,scope有三种形式: 默认的scope,DOM元素上原有的scope scope: ...
- angular之scope.$watch
某“大神”挖了个陨石坑,我于是乎似懂非懂的接手,玩了一个月angular.现在项目告一段落,暂别了繁重的重复性工作,可以开始回顾.认真的折腾下之前犹抱琵琶的angular. angular吸引人的特性 ...
- 38.angular的scope作用域
转自:https://www.cnblogs.com/best/tag/Angular/ 1. Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带. S ...
- Angular自定义指令directive:scope属性
在AngularJS中,除了内置指令如ng-click等,我们还可以自定义指令.自定义指令,是为了扩展DOM元素的功能.代码中,通过指定directive中的restrict属性,来决定这个指令是作为 ...
- Angular之 Scope和 Directive
---------------------------Scope-------------------------------- https://docs.angularjs.org/guide/sc ...
- Angular中directive——scope选项与绑定策略,这个也经常迷惑的。
开门见山地说,scope:{}使指令与外界隔离开来,使其模板(template)处于non-inheriting(无继承)的状态,当然除非你在其中使用了transclude嵌入,这点之后的笔记会再详细 ...
随机推荐
- C输入输出函数与缓冲区
#转 对C语言输入输出流和缓冲区的深入理解C语言缓冲区(缓存)详解缓冲区又称为缓存,它是内存空间的一部分.也就是说,在内存空间中预留了一定的存储空间,这些存储空间用来缓冲输入或输出的数据,这部分预留的 ...
- Wordpress 标题设置
使用标题格式:首页(网站标题 - 网站副标题),其他页面(页面标题 | 网站标题) 在后台找到头部文件head.php <?php wp_title('|', true, 'right'); e ...
- Linux Samba服务器配置
Linux系统默认已经安装了Samba,但是没有安装Samba服务: 1,先查看安装情况:rpm -qa|grep samba 根据系统的安装情况选择下载或者通过光驱安装所缺的rpm包. 我的安装情况 ...
- 20145320《Java程序设计》第3周学习总结
20145320<Java程序设计>第3周学习总结(第四章) 教材学习内容总结 对象(Object):存在的具体实体,具有明确的状态和行为 类(Class):具有相同属性和行为的一组对象的 ...
- Python数据
读取文件中数据的最高分数 highest_score=0 result_f=open("results.txt") for line in result_f: (name,scor ...
- 纯CSS实现帅气的SVG路径描边动画效果(转载)
本文转载自: 纯CSS实现帅气的SVG路径描边动画效果
- MVC返回JSON数据格式书写方式
返回json数据格式,多个返回值加,隔开 [Route("api/users/web")] //如果不加这个路由请这样调用:/api/users/web?schoolname=十五 ...
- Spark实战4:异常检测算法Scala语言
异常检测原理是根据训练数据的高斯分布,计算均值和方差,若测试数据样本点带入高斯公式计算的概率低于某个阈值(0.1),判定为异常点. 1 创建数据集转化工具类,把csv数据集转化为RDD数据结构 imp ...
- 学习Linux系列--安装Ubuntu
最近学习Linux,使用虚拟机太不方便,于是购买了阿里云最便宜的云主机作为学习设备. 本系列文章记录了个人学习过程的点点滴滴. 学习Linux系列--安装Ubuntu 学习Linux系列--安装软件环 ...
- Script 简单语句的练习题
猜拳 <body>请输入剪刀或者石头或者布:<br /><input type="text" id="A"/><inp ...