AngularJs开发——指令间的通信

指令之间通信,跟控制器间的通信差不多,无非是也是几种方法:

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

service的方式是实现控制器之间、指令与控制器之间,以及指令之间都可以使用的方法,使用方法也差不多,在注册指令或者控制器时,将依赖服务注入就就可以完成通信了。event 是scope作用域层级传播,所以理所当然用来解决控制器之间的通信,但是指令与控制器、指令之间再使用event,有点绕,很不优雅,所以指令间通信最好不要使用基于event。

通过指令自身参数,已经很完美得实现父子指令双向间通信和同级指令间通信,实现的关键是公用同一个scope实现双向绑定。

父子级指令间通信

指令相当于是一个模块,而 require 告诉指令自己运行需要引用另外一个指令(模块),定义在 controller 上就能把方法和属性怎么暴露出去。所以有使用require肯定会有controller,有使用controller不一定会使用到require。

require参数:

  • ^:从父节点上寻找依赖的其他指令
  • ?:告诉指令如果没有找到依赖的指令,不要抛出异常。

DEMO

以上代码我们发现:

  • 父指令 superset的scope:true,不能设置成单独的scope,不然子指令就不能父指令的scope。
  • 暴露API:在父级指令中,把要暴露的属性定义在scope上,而暴露的方法则定义在this。

同级指令间通信

同级指令的通信更简单,将指令包在一个controller内,让那些指令都公用同一个scope,其实跟上面父子级通信方法原理是一样的。

DEMO

本文源链接:http://www.html5jscss.com/angular-between-directive.html

转载请注明《AngularJs开发——指令间的通信》| html5jscss

评论关闭了.