Wait 'join' event to emit in controller

[ghost]

I built socket factory and injected it to one of my controllers.

angular
    .module('app')
    .factory('socket', socket);

socket.$inject = ['socketFactory', 'authenticationFactory', 'SOCKET_EVENT', 'API'];
function socket(socketFactory, authenticationFactory SOCKET_EVENT, API) {

    var socketIO = io.connect(API.SOCKET),
        userInfo = authenticationFactory.getUserInfo();

    socketIO.on('connect', function() {
        if(!userInfo) {
            logger.error('No userInfo,logging out!');
            authenticationFactory.logout();
            return;
        }

        socketIO.emit('join', { token: userInfo.token });
    });

    socketIO.on('join', function(data) {
        socketIO.emit(SOCKET_EVENT.REQ_MAIN_DATA, { });
    });

    var mySocket = socketFactory({
        ioSocket: socketIO
    });

    return mySocket;
}

Controller:

angular
    .module('app')
    .controller('Controller', Controller);

Controller.$inject = ['socket', 'SOCKET_EVENT'];
function Controller(socket, SOCKET_EVENT) {
    var vm = this;
    socket.emit(SOCKET_EVENT.REQ_OTHER_DATA);
}

The problem is that when I refresh the view where this controller is located, controller fires socket.emit before join event. So how to wait join event's result in controller?