改善这种AngularJS工厂socket.io使用

问题描述

我想在AngularJS使用socket.io。
我发现下面的工厂：

  app.factory（'插座'，函数（$ rootScope）{
    变种插座= io.connect（）;
    返回{
        于：功能（eventName的，回调）{
            socket.on（eventName的，函数（）{
                变参=参数;
                $ rootScope。$应用（函数（）{
                    callback.apply（插座，参数）;
                }）;
            }）;
        }，
        发出：功能（eventName的，数据，回调）{
            socket.emit（eventName的，数据功能（）{
                变参=参数;
                $ rootScope。$应用（函数（）{
                    如果（回调）{
                        callback.apply（插座，参数）;
                    }
                }）;
            }）
        }
    };
 

和它在像控制器用于：

 函数MyCtrl（$范围，插座）{
    socket.on（信息，功能（数据）{
        ...
    }）;
};
 

的问题是，每个控制器被访问另一个侦听时间加入，所以在接收到的消息时，它被处理多次。

什么可以给socket.io与AngularJS整合更好的策略？

编辑：。我知道我可以在工厂返回任何结果，并在那里做的听，然后用$ rootScope $广播和$ $范围在控制器上，但它看起来并不像一个很好的解决方案

EDIT2：加入工厂

 初始化：功能（）{
            socket.removeAllListeners（）;
}
 

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

仍然不觉得自己是最好的解决方案。

解决方案

删除每当控制器被销毁的套接字监听。
您需要在 $摧毁绑定事件是这样的：

 函数MyCtrl（$范围，插座）{
    socket.on（信息，功能（数据）{
        ...
    }）;    $范围。在$（'$破坏'，函数（事件）{
        socket.removeAllListeners（）;
        //或者类似的东西
        // socket.removeListener（本）;
    }）;
};
 

有关详细信息，请检查。

I want to use socket.io in AngularJS.I found the following factory:

app.factory('socket', function ($rootScope) {
    var socket = io.connect();
    return {
        on: function (eventName, callback) {
            socket.on(eventName, function () {
                var args = arguments;
                $rootScope.$apply(function () {
                    callback.apply(socket, args);
                });
            });
        },
        emit: function (eventName, data, callback) {
            socket.emit(eventName, data, function () {
                var args = arguments;
                $rootScope.$apply(function () {
                    if (callback) {
                        callback.apply(socket, args);
                    }
                });
            })
        }
    };

and it is used in the controller like:

function MyCtrl($scope, socket) {
    socket.on('message', function(data) {
        ...
    });
};

the problem is that each time the controller is visited another listener is added, so when a message is received it is handled multiple times.

what can be a better strategy to integrate socket.io with AngularJS ?

EDIT: I know that I can return nothing in the factory and do the listening there, then use $rootScope.$broadcast and $scope.$on in the controllers, but it doesn't look like a good solution.

EDIT2: added to the factory

init: function() {
            socket.removeAllListeners();
}

and call it at the beginning of each controller that use socket.io.

still doesn't feel like the best solution.

解决方案

Remove the socket listeners whenever the controller is destroyed.You will need to bind the $destroy event like this:

function MyCtrl($scope, socket) {
    socket.on('message', function(data) {
        ...
    });

    $scope.$on('$destroy', function (event) {
        socket.removeAllListeners();
        // or something like
        // socket.removeListener(this);
    });
};

For more information check the angularjs documentation.

这篇关于改善这种AngularJS工厂socket.io使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！