How to concatenate a URL in an Observable with data from storage?

ionic
#1

  • In my provider I am getting data from storage in the constructor.

  • I want to take the retrieved data from storage and use it to concatenate a URL in an observable from which I’ll return an http.get request.

The problem is that the data from storage only exists within the storage.get request. How do it get the storage data into my observable?

constructor( private http: HttpClient, public storage: Storage ) {
    this.storage.get('myAddress').then((data) => {
      if(!data)
          {
            this.digiAddress = "Update Address"
          } 
          else
          { 
            this.digiAddress = data;
          }
    });
  }


  fetchDigi(): Observable<any> {
    return this.http.get(`${this.explorer}${this.digiAddress}`);
  }

Any clues will be greatly appreciated! I just hope I’m not embarrassed by the answer :slight_smile:

#2

Is it really the case? I mean you seems to set the result to a provider class variable digiAddress so this.digiAddress is also accessible from fetchDigi()

isn’t the problem that the storage.get isn’t finished when you call fetchDigi() therefore digiAddress isn’t defined?

you could maybe pack everything together, like

async fetchDigi(): Promise<any> {
    const data = await this.storage.get('myAddress');
    const digiAddress = !data ? 'Update Address' : data;
    return this.http.get(`${this.explorer}${this.digiAddress}`).toPromise();
}

not to do so I modified the method in Promise, maybe it doesn’t fit your need you maybe rather like to stick to Observables and also not 100% so early morning I don’t had a coffee yet

#3

You are right, the issue is that the data from storage isn’t finished, leaving digiAddress undefined.

I like your idea and will try something like this. I am also curious about how to do this with observables.

Thanks for your help. Get some coffee :slight_smile:

1 Like
#4

I ended up with this, which works great:

async buildURL(): Promise<any>{
    const data = await this.storage.get('myAddress');
    this.digiAddress = !data ? 'Update Address' : data;
    this.explorerURL = `${this.explorer}${this.digiAddress}`;
    return this.http.get(this.explorerURL).toPromise();
  }

I was able to access the data with .then in another page. Thank you for your suggestion @reedrichards !

1 Like
#5

Awesome, cool to hear it worked out :slight_smile: