Unsubscribe from Angular2 method when providing specific answer?

Question

I am trying to understand how I can unsubscribe from a method in Angular2 when the method receives a specific response.

settings.component.ts

This is the method in question in my component, the value of this.selectedBridge is just a string with an IP address as the value.

public connectToBridge() {
    this._hueService.connectToBridge(this.selectedBridge)
        .subscribe(bridgeResponse => { this.bridgeResponse = bridgeResponse });
}

bridgeresponse.model.ts

This is the model I map inside my hue.service.

export interface BridgeResponse {
    error: Error;
    success: Success;
}

export interface Error {
    type: string;
    address: string;
    description: string;
}
export interface Success {
    username: string;
}

hue.service.ts

connectToBridge(bridgeIp) {
    return Observable.interval(2000).flatMap(() => {
        return this.http.post('http://localhost:54235/api/hue/ConnectToBridge',
                JSON.stringify(bridgeIp),
                { headers: this.headers })
            .map(response => <BridgeResponse>response.json());
    });

As you can see, I use observable to track the API endpoint every 2 seconds to check if the response has changed, is there a better way to do this? In fact, if the success value inside the model is not equal to zero, I want to unsubscribe from this method and stop polling it every 2 seconds.

, , .NET Core WebApi API.

Answer 1

takeWhile:

public takeWhile(predicate: function(value: T, index: number): boolean): Observable<T>

, , , , .

connectToBridge(bridgeIp) {
    return Observable.interval(2000).switchMap(() => {
      return this.http.post('http://localhost:54235/api/hue/ConnectToBridge',
          JSON.stringify(bridgeIp), {
            headers: this.headers
          })
        .map(response => < BridgeResponse > response.json());
    }).takeWhile(data=>data.success===null);
}