Angular2中的WebSocket服务，访问父组件

Question

我正试图在angular2中实现我自己的WebSockets使用方式，我正面临一个非常愚蠢的问题。

我定义了一个服务，它有一个方法，通过获取一个url和两个函数，返回一个WebSocket对象，一个用作“onmessage”，一个用作“onerror”(我硬编码了“onopen”和“onclose”，因为它们不会因组件而异):

    @Injectable()
export class WsService {

    createWebSocket(url: string, onMessage: (e: Event) => any, onError: (e: Event) => any ): WebSocket {
        let ws = new WebSocket(url);
        ws.onopen = function(evt: Event) {
            console.log("Connected!");
        }
        ws.onclose = function(evt: Event) {
            console.log("Disconnected!");
        }
        ws.onmessage = onMessage;
        ws.onerror = onError;
        return ws;
    }
}

然后在我的appComponent中，我实例化了一个WebSocket对象，如下所示：

ngOnInit(){
this.ws = this._ws.createWebSocket("ws://localhost:63562", this.on_msg, this.on_err);
}

on_msg(e: Event) {
      this.blah = e["data"];
  }

  on_err(e: Event) {
      console.log(e);
  }

现在的问题是，尽管“on_msg”函数是在AppComponent中定义的，但它将自己视为WebSocket对象的一部分，因此它不能访问和操作AppComponent中定义的变量。

我该怎么办？

Answer 1

使用一个已经制作好的库，比如这个:https://www.npmjs.com/package/angular2-websocket-service

它将利用您能找到的错误，并且通常基于最佳实践...

[edit]RxJS也有类似的功能：

https://github.com/ReactiveX/rxjs/blob/master/src/observable/dom/WebSocketSubject.ts