Watchable: Yield the outcome of a Promise as long as watching continues

Question

Watchable: Yield the outcome of a Promise as long as watching continues

I am looking to create a function in Angular and TypeScript that will return an Observable for subscription. This Observable should emit the result of a Promise every three seconds.

Currently, I have a function that returns a Promise, but I need it to return the outcome of that Promise:

public static getWifiInfos(): Observable<Promise<ConnectionInfo>> {
    return Observable
        .interval(3000)
        .map(() => Hotspot.getConnectionInfo());
}

Any suggestions on how to achieve this desired functionality?

angular typescript observable

Answer 1

Answer №1

To solve your problem, you should utilize the switchMap function, which links an interval to the results of a different Observable. It's difficult to explain it in any other way.

public static fetchWirelessDetails(): Observable<ConnectionInfo> {
  return <Observable<ConnectionInfo>> Observable
    .interval(3000)
    .switchMap(() => 
      Observable.fromPromise(Wifi.getConnectionInfo())
    )
}

Answer 2

To solve your problem, you should utilize the switchMap function, which links an interval to the results of a different Observable. It's difficult to explain it in any other way.

public static fetchWirelessDetails(): Observable<ConnectionInfo> {
  return <Observable<ConnectionInfo>> Observable
    .interval(3000)
    .switchMap(() => 
      Observable.fromPromise(Wifi.getConnectionInfo())
    )
}

Answer 3

Answer №2

Here is a suggestion for you to try:

private connectionInfoSubject = new Subject<ConnectionInfo>();

connectionInfoObservable = this.connectionInfoSubject.asObservable();

public static getWifiInfos(): Observable<ConnectionInfo>{
    Observable
        .interval(3000)
        .map(() => {
            // Assuming Hotspot.getConnectionInfo is a synchronous call                
            this.connectionInfoSubject.next(Hotspot.getConnectionInfo());
            // If Hotspot.getConnectionInfo returns a promise
            Hotspot.getConnectionInfo().then(result => {
                this.connectionInfoSubject.next(result);
            })
        });
}

I hope this information proves helpful!

Answer 4

Here is a suggestion for you to try:

private connectionInfoSubject = new Subject<ConnectionInfo>();

connectionInfoObservable = this.connectionInfoSubject.asObservable();

public static getWifiInfos(): Observable<ConnectionInfo>{
    Observable
        .interval(3000)
        .map(() => {
            // Assuming Hotspot.getConnectionInfo is a synchronous call                
            this.connectionInfoSubject.next(Hotspot.getConnectionInfo());
            // If Hotspot.getConnectionInfo returns a promise
            Hotspot.getConnectionInfo().then(result => {
                this.connectionInfoSubject.next(result);
            })
        });
}

I hope this information proves helpful!

Watchable: Yield the outcome of a Promise as long as watching continues

Answer №1

Answer №2

Similar questions

Creating a typescript object shape without an index signature involves specifying the exact properties

Encountering the "DevToolsActivePort file does not exist" error when executing Angular e2e tests via GitHub Actions

Merging JSON Array of Objects from Separate Http Services in Angular 8

What is the purpose of exporting both a class and a namespace under the same name?

Having to reinstall node modules is a repetitive task that must be done after each build of an Angular

Setting up Angular 7 to interact with a .Net Core Web API in Visual Studio 2017

What is the most effective way to sort a list using Angular2 pipes?

What is the method for obtaining the properties of a type as an array in Typescript?

How can I upload multiple images in one request using Typescript?

Angular2 Animation for basic hover effect, no need for any state change

Uncovering a commitment to reveal the valuable information within

What is the method for defining a CSS property for the ::before pseudo element within an Angular component?

Type guards do not work properly on a union of enum types in TypeScript

When the down arrow key is pressed, the focus of the radio button is lost

Activating the microphone device on the MediaStream results in an echo of one's own voice

Next.js Custom App now offers full support for Typescript in Accelerated Mobile Pages (

Tips for successfully sending an array of numbers using TypeScript and React

What is the best way to end a Google OAuth session using Firebase on an Ionic 2 application?

Typescript's async function failing to execute properly

When working with TypeScript, encountering an error involving an array containing an index signature