Read data from Firebase realtime databse

Navigation
0

I'm developing an angled application, and I need to read the data written to my realtime database from firebase.

How would I do to read all the data that is inside object 9 for example? I need to read this data and write it to variables, so I can compare it with other values.

Here is the code for my component.ts: 

    import { Component, OnInit } from '@angular/core';
import { MatDialog } from '@angular/material';
import { QuestionarioService } from 'src/app/providers/questionario.service';
import { MenuService } from 'src/app/providers/menu.service';
import { FirebaseService } from 'src/app/modules/utils/providers/firebase.service';
import { SessionService } from 'src/app/modules/utils/providers/session.service';
import { Http, Response } from '@angular/http'; 

@Component({
  selector: 'app-questionario',
  templateUrl: './questionario.component.html',
  styleUrls: ['./questionario.component.sass']
})

export class QuestionarioComponent implements OnInit {

 firebase:any;

 valorR:number = 0;
 valorG:number = 0;
 valorB:number = 0;
 valorA:number = 0;
 valorS:number = 0;
 valorI:number = 0;

  constructor(public questionario:QuestionarioService,
  public menu:MenuService,
  public dialog: MatDialog,
  public session: SessionService,
  private http: Http) {
    this.firebase = new FirebaseService();
   }


  ngOnInit() {
  window.scrollTo(0,0);

  let url = ''
  this.http.get( url )
     .pipe( (data: Response) => data.json() ) /* Necessário converter para JSON */
     .subscribe( answers => console.log( answers ) ); 
  }



  getRadioValorR(event){
    if(event.value > this.valorR){
      this.valorR = event.value;
      }
    }


  getRadioValorB(event){
    if(event.value > this.valorB){
      this.valorB = event.value;
    }
  }

  getRadioValorA(event){
    if(event.value > this.valorA){
      this.valorA = event.value;
    }
  }
  getRadioValorS(event){
    if(event.value > this.valorS){
      this.valorS = event.value;
    }
  }

  getRadioValorI(event){
    if(event.value > this.valorI){
      this.valorI = event.value;
    }
  }

  derteminaG(){
    this.valorG = this.valorR;
    if(this.valorG < this.valorB){
      this.valorG = this.valorB;
    }
    if(this.valorG < this.valorA){
      this.valorG = this.valorA;
    }
    if(this.valorG < this.valorS){
      this.valorG = this.valorS;
    }
    if(this.valorG < this.valorI){
      this.valorG = this.valorI;
    }
   return this.valorG;
  }

  getClass0(){
    if(this.derteminaG() == 0){
      return true;
    }

  }
  getClass1(){
    if(this.derteminaG() == 1){
      return true;
    }
  }
  getClass2(){
    if(this.derteminaG() == 2){
      return true;
    }
  }
  getClass3(){
    if(this.derteminaG() == 3){
      return true;
    }
  }

    Desabilitar(element){
    var radio = document.getElementById(element) as HTMLInputElement;
    if(radio.style.display == 'none'){
      radio.style.display = 'table-cell';
    }else radio.style.display = 'none';
  }



}
    
asked by anonymous 16.11.2018 / 20:19

2 answers

0

Use in your role: 

  var key: string;
  return new Promise((resolve, reject) =>{
  return this.db.object("9" + key).snapshotChanges()
  .map(c => {
    return { key: c.key, ...c.payload.val() };
  });
})
    
16.11.2018 / 20:33
0

For this you need to use the Http module of the angle to make a request for your table in the firebase and thus extract the desired value.

First step: import the Http module inside your app.module.ts 

/* app.module.ts*/

import { HttpModule } from '@angular/http';


...

imports[
  ...
  HttpModule      /* Adicionar o HttpModule dentro de imports */
]

Step 2: Import the Http inside the component that wants to make the request and start setup

Read the comments in the code to understand each step 

...

import { Http, Response } from '@angular/http'; 
/* Importa o Http e também o tipo Response */

constructor( private http: Http) {} // Adicione o módulo ao seu constructor

ngOnInit() {
     /* O método GET retorna os dados da sua requisição */
     /* Você precisa passar a URL do seu banco de dados no Firebase como parametro*/

     /* As URLs do Firebase geralmente tem esse formato: 
      *  https://nomeprojeto-18e6c.firebaseio.com/recipes.json
      */

    let url = 'https://nomeprojeto-18e6c.firebaseio.com/nomebanco.json'
     this.http.get( url )
     .pipe( (data: Response) => data.json() ) /* Necessário converter para JSON */
     .subscribe( answers => console.log( answers ) ); 

     /* console.log imprimirá sua tabela com os objetos 9, 10, 11*/
}

IMPORTANT INFORMATION IN ITS CONTEXT

Within subscribe you can assign the returned value to a variable.

I'll add a property above the constructor to illustrate what can be done.

... 

import { Http } from '@angular/http'; /* Importa o Http */



Answers: any; /* VARIÁVEL NOVA */
constructor( private http: Http) {} // Adicione o módulo ao seu constructor

ngOnInit() {
     /* O método GET retorna os dados da sua requisição */
     /* Você precisa passar a URL do seu banco de dados no Firebase como parametro*/

     /* As URLs do Firebase geralmente tem esse formato: 
      *  https://nomeprojeto-18e6c.firebaseio.com/recipes.json
      */

    let url = 'https://nomeprojeto-18e6c.firebaseio.com/nomebanco.json'
     this.http.get( url )
     .pipe( data => data.json() ) /* Necessário converter para JSON */
     .subscribe( answers => {
         this.answers = answers 
     }); 

     /* console.log imprimirá sua tabela com os objetos 9, 10, 11*/
}
    
16.11.2018 / 20:48
Image Inclusion in Database - LongBlob Dynamic layout with multiple buttons inside - android