title: Wait for data to be fetched from Firestore
body: <p>I am stuck on a scenario and not able to achieve the following. My project is in ionic3 and Firestore.</p>
  
  <ul>
  <li>I have a page to display a list.</li>
  <li>I have a provider class which fetches the list in the <code>constructor</code> method from Firestore and stores it in an Array.</li>
  </ul>
  
  <p>As both execute together how would I know when my data is fetched in the provider so I can call a method from my page.ts to get the list.</p>
  
  <p>I have tried the following approach...</p>
  
  <p>In the Page.ts</p>
  
  <pre><code>constructor(private provider: Provider){
  provider.whenDataReady(this.doThis);
  }
  
  doThis(list: Array&lt;any&gt;){
  //Do things
  }
  </code></pre>
  
  <p>In the Provider.ts</p>
  
  <pre><code>whenDataReady(callback){
  if(this.list == undefined){
     setTiomout(this.whenDataReady, 3000)
  }else{
     callback(this.list);
  }
  }
  </code></pre>
  
  <p>The <code>this.list == undefine</code> check in Provider.ts is always true even when it is not undefined.</p>
  
  <p>So here is the thing I am trying to do. Please let me know if there is a better way. I want to display user's Friend data in a list in different pages. 
  In Provider:</p>
  
  <ol>
  <li>Query the list of friend ID. </li>
  <li>Get profile data(like name) for all friend ID in loop or Promise.all. </li>
  </ol>
  
  <p>As the list can be very big and can cost me a lot of reads(Profile Data) I am doing in the following way. </p>
  
  <p>I am subscribing to the friend ID list changes and keeping them in an Array. Any page can access this Array and read as many friend profile data as needed. Once the data is stored it will not be read again for that session. 
  So the problem is before accessing the Friend ID Array in the Provider I need to make sure it's already fetched. Does that make sense?</p>