0

Provider

import { AngularFireDatabase } from '@angular/fire/database';
import { Injectable } from '@angular/core';

@Injectable()
export class ContatoProvider {

  private PATH = "contatos/";

  constructor(private db: AngularFireDatabase) {

  }

  getAll() {
    return this.db.list(this.PATH, ref => ref.orderByChild('name'))
      .snapshotChanges()
      .map(changes => {
        return changes.map(c => ({ key: c.payload.key, ...c.payload.val() }));
      })
  }

home.ts

import { Component } from '@angular/core';
import { NavController, ToastController } from 'ionic-angular';
import { ContatoProvider } from '../../providers/contato/contato';
import { Observable } from 'rxjs';


@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  contatos:Observable<any>;

  constructor(
    public navCtrl: NavController, private toast: ToastController,
    private provider: ContatoProvider) {

    this.contatos = this.provider.getAll();
  }

**home.html**

<ion-content padding>

  <ion-card *ngFor="let contato of contatos | async">
    <ion-card-header>
      <h2><strong>{{ contato.name }}</strong></h2>
    </ion-card-header>
    <ion-card-content>
      <p>{{ contato.tel }}</p>
      <br>
      <button ion-button full (click)="editContact(contato)">
        Add
      </button>
      <button ion-button full color="danger" (click)="removeContact(contato.key)">
        Delete
      </button>
    </ion-card-content>
  </ion-card>
1
  • Oi Allan, bem vindo ao StackOverflow, por favor edite sua pergunta invés de adicionar um comentário com código 8/01/2019 às 16:13

1 Resposta 1

0

Eu recuperei armazenando os dados de retorno em um objeto:

vm.obj = [];
db.collection("minhaTabela").get().then((querySnapshot) => {
     querySnapshot.forEach((doc) => {
     vm.obj.push(doc.data());
   });
});

Percorrendo o retorno e dando um push para um Array.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .