How can I convert asynchronous mode to synchronous? Just by Subscribing? I am getting data from Firebase using Firebase API's and displaying them in my app but due to asynchronous mode, the display event occurs before the data is retrieved. I am shifting to using AngularFire but not sure if AngularFire by default uses asynchronous. I want to wait for the data before my program moves to executing next steps. I am using Ionic2, have a provider which connects to Firebase, fetches data, stores in a local array in the provider with the ".then" method. The display page injects the provider and stores Firebase array data locally again in the display page, And then use the local variable in the html (ion-item) to display it. Basically, I want the data to be refreshed with any changes to Firebase data by any user.
0
votes
There is no 'mode'. Firebase works asynchronously and data is valid only when it's returned from Firebase. You need to plan for that and only work with that data once it's returned. While the question is valid, it's to vague to really answer without seeing your code. Please read through this guide How to create a Minimal, Complete, and Verifiable example
– Jay
Jay, Thanks for your help. I will paste some code today and browse through the links you suggested. Basically here is my intent. First, I do not want to get data from Firebase every time I visit the page especially if I visit the page multiple times in a single day as there may not be any changes to the data. But if any 1 of the 10 users update data, I want al users to see latest data. Second, I want some data to be available on multiple pages and need to use the same code.
– DKK
I initially put my entire code in the provider creating a local list variable inside the provider and using that list array in my pages, but due to asynchronous nature, the pages get empty data. But if I move the code that handles the promise (.then) to actual pages, I do get data inside the page but I have to duplicate the code for every page and it gets data from Firebase for each visit to the page.
– DKK
2 Answers
0
votes
Make use of 'async' pipe to display data from any observables in angular template. It populates the view whenever data is ready.
Below reference should help you to have an understanding of handling obervables using angularfire2. cheers :) https://github.com/angular/angularfire2/blob/master/docs/2-retrieving-data-as-objects.md#retrieve-data
0
votes
The only way to do this, is to use the 'async' in your template like below.
<ion-list>
<button ion-item class="center" *ngFor="let user of users | async" (click)="showOptions(user.$key, user.Name)">
{{user.title}}
</button>
</ion-list>
Above, there is a list of users type: 'FirebaseListObservable' which is included from the 'angularfire2/database' like below:
import { FirebaseListObservable } from 'angularfire2/database';
You can check this tutorial, which does exactly what you want and there is a live example on the description.
I suggest you to migrate to Ionic 3, it is much easier to use with firebase.
