用postal.js在angular中实现订阅发布消息
2016-08-04 10:24
459 查看
用postal.js在AngularJS中实现event bus
理想状态下,在一个AngularJS应用中,控制器都应该是相互独立的代码单元,它们之间不应该有任何的相互引用。但是有些时候,你还是需要让控制器在你的应用中相互交流。例如你现在有一个叫做Orders的控制器,它需要告诉一个叫做Cart的控制器其中需要添加一个新项目。
实现这种类型的交流方式的最好的方法之一就是使用event bus。
postal.js正是一个在JS中实现了event bus的库。
Postal.js是一个使用Javascript编写的,位于内存中的message bus,它收到了AMQP的一些启发。Postal.js在浏览器中运行,同时也可以使用Node.js在服务器端运行。它采用了JS程序员很熟悉的“事件类型”编程范式,同时通过提供“broker”以及更加精巧实现的subscriber来扩展了事件类型。
你可以使用postal在特定的频道中发布消息。通过这种方式,你可以将你的消息分割为app,cart,ui等不同类型。它同时也使用了envelope设计模式来方式你的订阅回调中有n个变量。
在使用postal.js时,你可以轻松的装饰$scope,并为它添加一个叫做$bus的方法来允许你和其他的控制器进行交流。
现在,你的控制器已经拥有了postal.js,你可以通过下面的代码来使用它:
在CartCtrl中,$scope.$bus.subscribe方法被调用。这个订阅被设置来监听orders频道上主题为order.new的所有消息。当一个消息的主题能够匹配上的时候,callback函数将会被调用。
在OrderCtrl中,$scope.$bus.publish方法在$scope.order方法被调用时被调用。它将会在正确的频道上发布一条消息,并使用正确的主题来触发订阅。发布出去的data将会被订阅中的callback收到,注意callback中还包含一个envelope,它是接收到的数据的一个包装。
通过使用$bus装饰器你可以让控制器之间的交流变得非常轻松。当然除了postal.js之外,还有很多其他的event bus库可以选择。但是如果你喜欢这个库的话,别忘了去Github上给作者Jim Cowart一些感谢!
本文译自An angular.js event bus with postal.js,原文地址http://jonathancreamer.com/an-angular-event-bus-with-postal-js/
转载自: http://www.html-js.com/article/Using-Angular-to-develop-web-application-with-postaljs-is-implemented-in-AngularJS-event-bus
转摘自 http://www.cnblogs.com/leosx/p/4065056.html
用postal.js在AngularJS中实现event bus
理想状态下,在一个AngularJS应用中,控制器都应该是相互独立的代码单元,它们之间不应该有任何的相互引用。但是有些时候,你还是需要让控制器在你的应用中相互交流。例如你现在有一个叫做Orders的控制器,它需要告诉一个叫做Cart的控制器其中需要添加一个新项目。实现这种类型的交流方式的最好的方法之一就是使用event bus。
postal.js正是一个在JS中实现了event bus的库。
Postal.js是什么?
Postal.js是一个使用Javascript编写的,位于内存中的message bus,它收到了AMQP的一些启发。Postal.js在浏览器中运行,同时也可以使用Node.js在服务器端运行。它采用了JS程序员很熟悉的“事件类型”编程范式,同时通过提供“broker”以及更加精巧实现的subscriber来扩展了事件类型。你可以使用postal在特定的频道中发布消息。通过这种方式,你可以将你的消息分割为app,cart,ui等不同类型。它同时也使用了envelope设计模式来方式你的订阅回调中有n个变量。
在使用postal.js时,你可以轻松的装饰$scope,并为它添加一个叫做$bus的方法来允许你和其他的控制器进行交流。
angular.module('myApp') .config(function ($provide) { $provide.decorator('$rootScope', [ '$delegate', function ($delegate) { Object.defineProperty($delegate.constructor.prototype, '$bus', { value: postal, enumerable: false }); return $delegate; }]); });
现在,你的控制器已经拥有了postal.js,你可以通过下面的代码来使用它:
angular.module('myApp') .controller('CartCtrl', ['$scope', function ($scope) { $scope.$bus.subscribe({ channel: 'orders', topic: 'order.new', callback: function(data, envelope) { console.log('it worked', data, evenlope); } }); } ]) .controller('OrderCtrl', ['$scope', function ($scope) { $scope.order = function() { $scope.$bus.publish({ channel: 'orders', topic: 'order.new', data: { /* order info */ } }); }; } ]);
在CartCtrl中,$scope.$bus.subscribe方法被调用。这个订阅被设置来监听orders频道上主题为order.new的所有消息。当一个消息的主题能够匹配上的时候,callback函数将会被调用。
在OrderCtrl中,$scope.$bus.publish方法在$scope.order方法被调用时被调用。它将会在正确的频道上发布一条消息,并使用正确的主题来触发订阅。发布出去的data将会被订阅中的callback收到,注意callback中还包含一个envelope,它是接收到的数据的一个包装。
总结
通过使用$bus装饰器你可以让控制器之间的交流变得非常轻松。当然除了postal.js之外,还有很多其他的event bus库可以选择。但是如果你喜欢这个库的话,别忘了去Github上给作者Jim Cowart一些感谢!本文译自An angular.js event bus with postal.js,原文地址http://jonathancreamer.com/an-angular-event-bus-with-postal-js/
转载自: http://www.html-js.com/article/Using-Angular-to-develop-web-application-with-postaljs-is-implemented-in-AngularJS-event-bus
转摘自 http://www.cnblogs.com/leosx/p/4065056.html
相关文章推荐
- MQTT的学习研究(十二) MQTT moquette 的 Future API 消息发布订阅的实现
- MQTT的学习研究(十二) MQTT moquette 的 Future API 消息发布订阅的实现
- Java实现redis的消息订阅和发布
- 【转】redis 消息队列发布订阅模式spring boot实现
- Java实现Redis的消息订阅和发布
- MQTT的学习研究(十四) MQTT moquette 的 Callback API 消息发布订阅的实现
- Spring Data Redis实现消息队列——发布/订阅模式
- Redis实现消息的发布/订阅
- 使用redis的发布订阅模式实现消息队列
- redis 消息队列发布订阅模式spring boot实现
- 【Redis】jedis客户端实现redis消息的发布订阅(实时消息中间件)
- 消息队列-ActiveMQ学习笔记(三)-发布-订阅消息模式实现
- 用rabbitMQ实现消息的发布和订阅
- Java实现Redis的消息订阅和发布
- MQTT的学习研究(十二) MQTT moquette 的 Future API 消息发布订阅的实现
- 使用Spring-Redis实现消息的发布/订阅
- linux下使用hiredis异步API实现sub/pub消息订阅和发布的功能
- Java实现Redis的消息订阅和发布
- Spring结合Redis实现消息发布与订阅
- 使用redis实现消息发布订阅