Wie synchronisiere ich ein Web-Socket-Objekt von meinem Dienst mit der Komponente -angular 2

Question

Ich versuche, ein Gerät mit einer externen JavaScript Web-Socket-Bibliothek zu verbinden und zu steuern. Momentan kann ich das aus meinem eckigen Service machen. Ich kann das Verbindungsobjekt nicht an die Komponente übergeben. Wie kann ich Update-Komponente erhalten, wenn das Service-Client-Objekt ist updated.Can jemand mir bitte helfen

Komponentencode

doConnect(data){ 
    this.submitted = true; 
    this.ipaddress = data.ipaddress; 
    this.portnumber = data.portnumber; 
    this.data = JSON.stringify(data); 
    console.log(this.data); 
    if(this.ipaddress===null && this.portnumber===null){ 
     console.log('Null'); 
    }else{ 
    localStorage.setItem("ipaddress", this.ipaddress); 
    localStorage.setItem("portnumber", this.portnumber); 

    //calling the get connect from component 
    this.connectService.getConnect(this.ipaddress,this.portnumber); 
    if(localStorage.getItem("clientStatus")=='connected'){ 
    this._router.navigate(['Master']); 
    }else{ 
    this._router.navigate(['Home']); 
    } 
    } 
} 

Unten ist mein Code Connect

getConnect(ipaddress,portnumber){ 
    console.log('coming'); 
    var t = ipaddress; 
    var p = portnumber; 
    console.log(t,p); 
    client = new linear.client({transports: [ 
           {type: 'websocket', 
           host: t, port: p} 
           ]}); 
    client.connect(); 
    this.getStatusFromMcx(); 

    var osbervable = Rx.Observable.create (function (obs) { 
    // Handle messages 
    client.transport.onopen = obs.onOpen.bind(obs); 
    client.onnotify = obs.onNext.bind(obs); 
    client.onerror = obs.onError.bind(obs); 
    client.transport.onclose = obs.onCompleted.bind(obs); 

    // Return way to unsubscribe 
    return client.ondisconnect.bind(client); 
    }); 

Answer 1

ich eine Lösung gefunden für mein Problem. Ich teile diese Antwort, weil dies jemandem helfen kann, der den Web-Socket benutzt, um sich mit externen Geräten zu verbinden. Ich habe Observable mit einem Intervall verwendet.

let stream$ = new Observable(observer => { 
    let interval = setInterval(() =>{ 
     observer.next(client.transport.state); 
     observer.complete(); 
    },1000); 
    return() =>{ 
     clearInterval(interval); 
    } 
    }); 
    return stream$; 

dann habe ich nur diese Methode abonniert und Verbindungsdetails erhalten.

this.subscription = this.AppService.getConnect(this.ipaddress,this.portnumber) 
    .retry(1) 
    .subscribe(
     value => { 
     console.log("value+++++",value); 
     spinner.stop() 
     if(value=="disconnected" || value=="connecting"){ 
      localStorage.setItem("clientStatus", "disconnected"); 
      spinner.spin(target); 
     }else{ 
      localStorage.setItem("clientStatus", "connected"); 
      this._router.navigate(['dashboard']); 
     } 
ngOnDestroy() { 
// prevent memory leak when component is destroyed 
this.subscription.unsubscribe(); 
}