How to get data from an observable firebase?

Asked

Viewed 390 times

0

I have a list that is loaded from firebase. This list has 3 attributes, value, id, and date. Only I will need to capture only one of these attributes and assemble an array with them, to then perform a mathematical calculation, I need to extract the property (value). I searched on map, and subscribe, but could not get a satisfactory result, always returns me [Object Object] on the console. Could someone help me?

  recompensas : Observable<Recompensa[]>;//meu observable
  public recompensa = {} as Recompensa;//meu model de dados

  //exibindo a minha lista na view
  ionViewDidLoad() {
     this.recompensas = this.recompensaProvider.buscarRecompensa(true);
  }  


  //minha tentativa de realizar o map e subscribe, sempre obtenho [object 
  //Object] no console
  teste() {
      const test = this.recompensas.subscribe(recs => recs.map(rec => 
      rec.valor ));
      console.log('valor de teste : '+test);
  }

  teste() {
      const test = this.recompensas.map(recs => recs.map(rec => 
      rec.valor ));
      console.log('valor de teste : '+test);
  }

inserir a descrição da imagem aqui

javascript angular ionic firebase typescript

2 answers

1

In his method teste() you do

teste() {
  const test = this.recompensas.subscribe(recs => recs.map(rec => 
  rec.valor ));
  console.log('valor de teste : '+test);
}

In that case the const test is a guy Subscription because you’re taking the value of your subscribe, you are registering correctly but to get the value you must search for it within the subscribe, something like this might work:

teste() {
  this.recompensas.subscribe(recs => {
    console.log('Seu array: ' + recs);
    recs.map(rec => console.log('Array mapeado por valor: ' + rec.valor))
  });
}

  • I used as you passed, I just couldn’t see the information on the console. It didn’t bring me anything

  • If you can include your code buscarRecompensa(), kindly

  • Here is my search codeRecompensates() It comes from a Provider : // This method will return a list of rewards searchRecompensates(rewardSalva: Boolean) { Return this.afs . Collection<Reward>(this.path, ref => { Return ref.Where('rewardSalva', '==', rewardSalva); }) . snapshotChanges() . map(actions => { Return actions.map(a => { const data = a.payload.doc.data() as Reward; const id = a.payload.doc.id; Return { id, ...data }; }) }); ; }

  • My doubt was whether the return is a observable same, by SnapshotChanges() is yes. Your view is updating normally?

  • This, my view updates normally. I display all rewards that are registered, with value and date.

  • Got it. When you’re calling your method teste()? I believe then to be the asynchronous value still not ready when you sign up on it, ideal would be to call this teste() with a button that only calls after the view with the value

  • That’s exactly what I’m doing, when the view loads I put a button, I click on that button after the rewards are loaded, to then run this test function()

  • I don’t understand why he wouldn’t show up on the subscribe so... it might be a silly test, but he could try it on his method: this.recompensas.subscribe(recs => console.log(recs))

  • He hasn’t returned anything either, I’m finding it strange too

  • Is your method really being fired? Tested put a console.log('etc') in the same method without any subscribe?

  • Yes, he does call. I’ve done the following now: this.rewardss.map(Recs => this.valorTotal = Recs.map(rec => rec.data )) assigns the value to this.valorToral, but when printing it it appears as Undefined

  • instead of rec.data is rec.valor, I ended up typing wrong

  • How strange. I think I could only really help you with the full code, because for me I can’t imagine that the view can map these values but in one subscribe or even in map is not possible.

  • I appreciate all the help you’ve given to trying to help. I managed to solve the problem, I will post the code here later, if anyone needs or goes through the same problem.

  • Opa, how great! Post yes, sure will be useful for those who already had, will have and even for knowledge.

Show 10 more comments

0

Try to make a return this way. I believe will succeed.

  Observable<List<Recompensa>> get recompesa =>
      Observable(_collection.snapshots().map((query) => query.documents
          .map<Recompensa>((document) => Recompensa.fromMap(document))
          .toList()));

Browser other questions tagged javascript angular ionic firebase typescript

You are not signed in. Login or sign up in order to post.