使用您知道将在 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 对等点，该 ID 在客户端连接后立即使用 socket.io 传输。因此，我知道 peer 对象将在 on 侦听器被触发之前创建。但是，我不认为 javascript 知道这一点。我如何设置它以便我可以在我的控制器中使用对等点的未来功能？

编辑：这是我目前所拥有的

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!"); });
    });
};

bar 中的 peer 对象（您的示例附加侦听器的位置）不需要存在，正如您所发现的，它不是这样工作的。目前尚不清楚 bar 对 peer 有什么需求，但是如果您需要与多个控制器共享一个对象，您应该将该对象包装在注入每个控制器的服务中：

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 对象之前不会调用回调。此模式处理在 peer 之前调用 PeerService.connected() 的控制器（即它被延迟）以及在 peer 之后实例化控制器的情况（即它立即被调用同行）

使用您知道将在 Javascript 和 Angular 中创建的对象的功能（具有 Peerjs 和 Socket.io）

Using functions of an object you know will be created in Javascript and Angular (featuring Peerjs and Socket.io)

javascript

sockets

angularjs

peerjs