(原文:http://www.html5jscss.com/controller-between-directive.html)

指令与控制器之间通信,跟控制器间的通信指令间通信也类似,也是下几种方法:

  1. 通过指令自身参数
  2. 基于event传播的方式
  3. service的方式

通过指令自身参数来共享对象、共享方法

首先我们必须得清楚,每一个 $scope 都是scope的一个事例,而通过绑定将数据绑定在 $scope 就能实现双向绑定。scope的层次结构跟controller相关,继承关系跟又遵循了原型继承的规则,而子controller所初始化的scope是创建一个新的变量,而不是去修改父controller中的值。所以就不难使用为什么不使用基本类型变量而是使用引用类型变量去实现控制器间的通信。

指令中怎么创建 scope:

  • scope默认值是false,表示scope跟父controller的scope相同
  • scope:true,表示创建一个继承自父scope的新scope,这样就可以让同一个父控制下的指令都可以使用这个scope进行通信。
  • 创建完全独立的属于指令自己的scope,这样可以防止读取和修改父级scope的数据。

创建完全独立的scope的API:

  • =:提供一个与父scope的双向绑定的属性。
  • &:能够在指令内访问定义在父scope注册的函数。
  • @:提供一个 父scope-》子指令的单向绑定的属性。

双向数据绑定DEMO(http://jsbin.com/xodebe/2/edit?html,js,output)。

通过服务

通过 services 实现控制器与指令双向通信,也比较简单,DEMO(http://jsbin.com/zaloj/5/edit?html,js,output)

基于event传播的方式

使用基于event来让控制器跟指令通信,指令中的 scope 就不能设置为独立的了,所以编写指令最好不要使用此方法。

DEMO(http://jsbin.com/makoxo/6/edit?html,js,output)

其实跟控制器通信中基于event传播原理是一样,只是把controller中的代码写在了diresctive中的controller中而已。

通过三种方法比较:个人比较推荐方法一中的创建独立scope。因为这样既不会污染其他scope,也能够一眼就能看出来该指令需要从外部scope得到方法或者属性。对于方法二个人觉得用在初始化还是挺不错的。对于方法三则不很不推荐。

AngularJs开发——指令与控制器间的通信的更多相关文章

  1. AngularJs开发——控制器间的通信

    AngularJs开发——控制器间的通信 指令与控制器之间通信,无非是以下几种方法: 基于scope继承的方式 基于event传播的方式 service的方式 基于scope继承的方式 最简单的让控制 ...

  2. iOS开发多线程篇—线程间的通信

    iOS开发多线程篇—线程间的通信 一.简单说明 线程间通信:在1个进程中,线程往往不是孤立存在的,多个线程之间需要经常进行通信 线程间通信的体现 1个线程传递数据给另1个线程 在1个线程中执行完特定任 ...

  3. AngularJS: 自定义指令与控制器数据交互

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  4. iOS开发多线程篇—线程间的通信(转)

    这里转载 给自己一个备份 一.简单说明 线程间通信:在1个进程中,线程往往不是孤立存在的,多个线程之间需要经常进行通信 线程间通信的体现 1个线程传递数据给另1个线程 在1个线程中执行完特定任务后,转 ...

  5. angular开发控制器之间的通信

    一.指令与控制器之间通信,无非是以下几种方法: 基于scope继承的方式 基于event传播的方式 service的方式(单例模式) 二.基于scope继承的方式: 最简单的让控制器之间进行通信的方法 ...

  6. iOS开发多线程篇 04 —线程间的通信

    iOS开发多线程篇—线程间的通信 一.简单说明 线程间通信:在1个进程中,线程往往不是孤立存在的,多个线程之间需要经常进行通信 线程间通信的体现 1个线程传递数据给另1个线程 在1个线程中执行完特定任 ...

  7. angular 控件间的通信

    先引入 设置meta元素 http://blog.sina.com.cn/s/blog_51048da70101cgea.html //设置 虚拟窗口的大小等于设备的大小 <meta name= ...

  8. AngularJS开发之_指令

    指令是什么?    指令是我们用来扩展浏览器能力的技术之一.在DOM编译期间,和HTML关联着的指令会被检测到,并且被执行.这使得指令可以为DOM指定行为,或者改变它. 1.指令的匹配模式 index ...

  9. Android UI开发第二十六篇——Fragment间的通信

    为了重用Fragment的UI组件,创建的每个Fragment都应该是自包含的.有它自己的布局和行为的模块化组件.一旦你定义了这些可重用的Fragment,你就可以把它们跟一个Activity关联,并 ...

随机推荐

  1. 【转】支持向量机(SVM)

    什么是支持向量机(SVM)? SVM 是一种有监督的机器学习算法,可用于分类或回归问题.它使用一种称为核函数(kernel)的技术来变换数据,然后基于这种变换,算法找到预测可能的两种分类之间的最佳边界 ...

  2. Redux应用单一的store原则案例详解

    在开发reac单页面应用的时候,页面的展示逻辑跟数据状态的关系管理变得越来越复杂,redux很好的解决这个问题.废话不多说,直接先上官网api链接. http://cn.redux.js.org/in ...

  3. vuex在项目中使用的一点总结

    以下为vue后台管理项目中使用vuex的一点总结,截取了其中部分代码,如有什么错误,还望指出. 1. token 存储 登陆成功之后,需要把获取到的 token 存储到 vuex 中,配合 axios ...

  4. 十个你需要在 PHP 7 中避免的坑

    1. 不要使用 mysql_ 类函数 终于,你不用再看到建议不要使用 mysql_ 函数的提示了.因为 PHP 7 从核心上完全移除了它们,这意味着请你移步至更好的 mysqli_ 类函数,或者更灵活 ...

  5. vue2.0项目引入element-ui

    在项目中,为了方便我们工作和开发效率,常常引入一些框架来帮助我们完成高效的工作,今天我们就用vue来搭建一下框架,并且引入element-ui这个框架.安装流程也是我从失败中摸索到的,希望能帮助大家. ...

  6. python/MySQL(索引、执行计划、BDA、分页)

    ---恢复内容开始--- python/MySQL(索引.执行计划.BDA.分页) MySQL索引: 所谓索引的就是具有(约束和加速查找的一种方式)   创建索引的缺点是对数据进行(修改.更新.删除) ...

  7. python github

    git 1. 版本控制 是否依稀记得你的毕业论文? 1 2 3 4 5 6 7 8 9 10 11 毕业论文_初稿.doc 毕业论文_修改1.doc 毕业论文_修改2.doc 毕业论文_修改3.doc ...

  8. C++ 多态的实现及原理

    C++的多态性用一句话概括就是:在基类的函数前加上virtual关键字,在派生类中重写该函数,运行时将会根据对象的实际类型来调用相应的函数.如果对象类型是派生类,就调用派生类的函数:如果对象类型是基类 ...

  9. 三.SQL语句实例

    1.查询A表中存在而B表中不存在的数据 1.1 描述:表A中有一tel字段,表B中有一tel字段,两个字段存储的内容部分相同,现要查询A表tel字段中有而B表tel字段中没有的数据 1.2 有三个se ...

  10. web攻击和防御措施

    1.SQL注入:参照下面的链接 http://www.cnblogs.com/chenhaoyu/p/8758888.html 2.跨网站脚本攻击(Cross Site Scripting, XSS) ...