Load Initial List From Ionic Native's Storage

Ionic Native
1

Hello, I’m trying to load a data list (similar to the list in the Super Starter), but initially from Storage. Any help would greatly be appreciated :slight_smile:

What I’m Trying to Do
Initially the list is empty, so pulling from Storage loads nothing. But after the user adds a new item, it saves to Storage. Even after killing the app, the user should open it back up to their list of items they created

What Happens Now Instead
Currently, I seem to have it almost working, but when opening the app after killing it, the empty list shows. If I then go to the list in the app (click the navigation to it again), all the items from Storage show as desired.

Question
How do I pre-load my list from Storage so that the empty list state does not show to the user? (It seems that my app is loading before the Storage promise returns…)

Code Currently
app.component.ts - calling my provider’s load

  constructor(public platform: Platform, public statusBar: StatusBar, 
                    public splashScreen: SplashScreen, 
                    public districtService: DistrictService) {
    this.initializeApp();

    districtService.load();

  }

district.service.ts - the load function

  districts: District[] = [];
  
  constructor(public storage: Storage) { }

  load() {
    this.storage.get('districts').then((districts) => {
      if(districts) this.districts = districts;
    });
}

So for the short, where and when would you load from Storage if you were doing this in the SuperStarter (since that’s what my code is based off of)?

Thanks!

2

If I’m your user, I don’t want that. I want to see that your app is doing something as quickly as possible, so if you don’t like the empty list state, then throw up a loading indicator while the read operation is happening.

1 Like
3

ok that make sense. I’m ok with showing the empty state while it loads then. But how would I make it load once the data does come in?
Currently I have to click to another page and come back to this one in order for it to show the loaded list of data.
Thanks!

4

One thing to ensure is that Storage is ready before you try to interact with it.