改进这个AngularJS工厂与socket.io一起使用

前端之家收集整理的这篇文章主要介绍了改进这个AngularJS工厂与socket.io一起使用前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想在AngularJS中使用socket.io。
我找到了以下工厂:
  1. app.factory('socket',function ($rootScope) {
  2. var socket = io.connect();
  3. return {
  4. on: function (eventName,callback) {
  5. socket.on(eventName,function () {
  6. var args = arguments;
  7. $rootScope.$apply(function () {
  8. callback.apply(socket,args);
  9. });
  10. });
  11. },emit: function (eventName,data,callback) {
  12. socket.emit(eventName,function () {
  13. var args = arguments;
  14. $rootScope.$apply(function () {
  15. if (callback) {
  16. callback.apply(socket,args);
  17. }
  18. });
  19. })
  20. }
  21. };

并在控制器中使用如下:

  1. function MyCtrl($scope,socket) {
  2. socket.on('message',function(data) {
  3. ...
  4. });
  5. };

问题是每次控制器被访问时,添加了另一个监听器,因此当接收到消息时,它被多次处理。

什么可以是更好的策略集成socket.io与AngularJS?

编辑:我知道我可以在工厂没有返回任何东西,并在那里听,然后在控制器中使用$ rootScope。$ broadcast和$ scope。$ on,但它看起来不是一个好的解决方案。

EDIT2:添加到工厂

  1. init: function() {
  2. socket.removeAllListeners();
  3. }

并在每个使用socket.io的控制器的开头调用它。

仍然不觉得像最好的解决方案。

每当控制器销毁时删除套接字侦听器。
你将需要绑定$ destroy事件像这样:
  1. function MyCtrl($scope,function(data) {
  2. ...
  3. });
  4.  
  5. $scope.$on('$destroy',function (event) {
  6. socket.removeAllListeners();
  7. // or something like
  8. // socket.removeListener(this);
  9. });
  10. };

有关详细信息,请检查angularjs documentation

猜你在找的Angularjs相关文章