AngularFireDatabase list function not being called on ios ionic

Question

I am trying to do the most basic retrieval with Ionic and AngularFireDatabase. My code is as follows:

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { SignInPage } from '../signin/signin';
import { FeedUser } from '../feeduser/feeduser';
import { FeedStylist } from '../feedstylist/feedstylist';
import { Keyboard } from '@ionic-native/keyboard';
import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database';


@Component({
  selector: 'page-sign-up',
  templateUrl: 'signup.html'
})
export class SignUpPage {
  stylist: boolean;
  user: boolean;
  items: FirebaseListObservable<any>;

  constructor(public navCtrl: NavController, public keyboard: Keyboard, public af: AngularFireDatabase) {
    this.items = af.list('/test');
    console.log(this.items);
  }

  ...

There are no errors, but nothing happens - the console message is never logged...not even null (if its not retrieving the items).

I am using Ionic 3.5.0, and iOS 10. This problem only happens on iOS device, it works in the browser. Thanks

it seems constructor of SignUpPage is never runned based on the console message is never logged. you should confirm whether your routing is working. — Pengyy
– Pengyy, Commented Jul 18, 2017 at 2:22

CharanRoot · Accepted Answer · 2017-07-18 18:19:42Z

2

af.list('/test') return observable so it will take some time to resolve value and return result but in your code your immediate accessing observable value before resolving observable.

you need subscribe observable and access value

example

 this.items = af.list('/test');
   this.items.subscribe(value=> {
        console.log(this.items);
    });

edited Jul 18, 2017 at 18:19

answered Jul 18, 2017 at 3:28

CharanRoot

6,3352 gold badges31 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

ewizard Over a year ago

thanks - ill try it soon - im wondering...do you have to do this because of ionic? in the angularfire2 docs it never mentions this...still getting to know ionic...is subscribe something i would use in other places too? would it just be used for network requests?

CharanRoot Over a year ago

I think your new to angular or Ionic. I will recommend to start learning observable before jumping to Ionic. yes you can use subscribe in other components and you need unsubscribe while destroying components

ewizard Over a year ago

ok...when i use your code it cant find snapshots variable...i changed it to value but yah you are right i am knew to observables and subscribe/unsubscribe

ewizard Over a year ago

after a 10-15 seconds an error pops up that says "Runtime Error: Network Error"

ewizard Over a year ago

github.com/angular/angularfire2/blob/master/docs/… all the way at the bottom there is an example with the preserveSnapshot option...is this it? also the docs on that page dont say anything about needing to subscribe when using list

|

ewizard · Accepted Answer · 2017-07-18 20:41:51Z

0

Here is what ended up working:

this.items = af.list('/test');
this.items.subscribe(items => items.forEach(item => { 
  console.log(item.$value);
}));

answered Jul 18, 2017 at 20:41

ewizard

2,8924 gold badges56 silver badges113 bronze badges

Collectives™ on Stack Overflow

AngularFireDatabase list function not being called on ios ionic

2 Answers 2

8 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related