javascript - 使用您知道将在 Javascript 和 Angular 中创建的对象的函数(以 Peerjs 和 Socket.io 为特色)

Question

我有以下代码片段

var peer = {};

var foo = function ($scope, socket) { // socket is a factory to wrap socket.io in angular
    socket.on('setUID', function (data) {
        peer = new Peer(data);
    });
};

var bar = function ($scope, socket) {
    peer.on('connect', function () { alert("blah"); }); // this line doesn't work
}

// foo and bar are both controllers in angular, which are attached to separate areas in the application

本质上，我想做的是使用服务器生成的 ID 创建一个新的 PeerJS 对等体，客户端连接后立即使用 socket.io 传输该 ID。因此，我知道对等对象将在 on 监听器被触发之前创建。但是，我认为 javascript 不知道这一点。我该如何设置它以便我可以在我的 Controller 中使用对等点的 future 功能？

编辑:这是我现在所拥有的

app.factory('peer', function ($rootScope, socket) {
    var peer = {};

    socket.on('setUID', function (data) {
        peer = new Peer(data, {host: 'localhost', port: 9000, path: "/peer/"});
        console.log("Peer created");
        peer.on('open', function (id) { // these work fine
            console.log('My peer ID is: ' + id);
        });

        peer.on('connection', function (conn) {
            conn.on('open', function () {
                conn.on('data', function (data) {
                    console.log("Received: " + data);
                });
            });
        });
    });

    return {
        getPeer: function () {
            return peer;
        }
    };
});


var bar = function ($scope, socket, peer) {
    var p = peer.getPeer();
    p.on("connection", console.log("hello")); // works once, then says p.on is not a function
}

Answer 1

您应该在 Peer 之后附加事件监听器是这样创建的:

var peer = {};

var foo = function ($scope, socket) { // socket is a factory to wrap socket.io in angular
    socket.on('setUID', function (data) {
        peer = new Peer(data);
        peer.on("connect", function () { alert("Hi!"); });
    });
};

peer您的 bar 中的对象(您的示例附加监听器的地方)不需要在那里，正如您所发现的，它不会像这样工作。目前还不清楚需要什么bar有peer从您的示例来看，但是如果您需要与多个 Controller 共享一个对象，您应该将该对象包装在注入(inject)每个 Controller 的服务中:

var PeerService = function ($q, socket) {
  var defered = $q.defer();
  var peer;

  socket.on("setUID", function (data) {
    peer = new Peer(data);
    deferred.resolve(p);
  });

  return {
    connected: function (callback) {
      $q.success(function () {
        callback(peer);
      });
    }
  }
};

var bar = function ($scope, PeerService) {
  $scope.data = [];

  PeerService.connected(function (peer) {
    peer.on("data", function (data) {
      $scope.data.push(data);
    })
  });
}

这个PeerService将接受回调，并且回调将不会被调用，直到它可以提供 peer目的。此模式处理 Controller 调用 PeerService.connected()之前有一个 peer (即它被推迟)以及在 peer 之后实例化 Controller 的情况(即立即与对等方调用)