如何清理从控制器分配的事件?

Kri*_*ian 6 javascript events socket.io angularjs angularjs-controller

控制器不再相关,何时,何地以及如何摆脱旧的事件监听器?

考虑SPA有两条路线:/login/loggedin

app.factory('socket', ['$window', function(window) {
    return window.io();
}]);
app.controller('loginController', ['socket', function (socket) {
    this.tryLogin = function(credentials) {
        socket.emit('login', credentials);
    }
    sokcet.on('loginResponse', function(data) {
        if (data.status == 'OK') {
            // Navigate to loggedInController
        } else {
            // Show error message and keep listening - user might try again
        }
    });
}]);
app.controller('loggedInController', ['socket', function (socket) {/* Logged in, but loginController is still listening for loginResponse */}]);
Run Code Online (Sandbox Code Playgroud)

问题:

  • 当导航到/loggedin那时loginResponse事件继续听
  • 当导航回/login页面时,新的监听器被添加(实际上我现在有2个监听器)

sdg*_*uck 5

看一下Angular的$scope.$on('$destroy')事件,并将它与socket.io的removeListener方法一起使用.像这样的东西:

app.controller('loginController', ['$scope', 'socket', function ($scope, socket) {
    this.tryLogin = function(credentials) {
        socket.emit('login', credentials);
    }

    socket.on('loginResponse', loginResponse);

    $scope.$on('$destroy', function() {
        socket.removeListener('loginResponse', loginResponse);
    });

    function loginResponse(data) {
        if (data.status == 'OK') {
            // Navigate to loggedInController
        } else {
            // Show error message and keep listening - user might try again
        }
    }
}]);
Run Code Online (Sandbox Code Playgroud)