получить коллекцию пожарного магазина, документ, используя angular4

Question

У меня есть база данных Firebase, и я пытаюсь получить ее через Angular.был в состоянии подключиться к базе данных, однако, не смог прочитать данные ... это то, что я сделал и не смог получить данные ...

Я, безусловно, что-то упустил, может кто-нибудь, пожалуйста, руководствоили предоставить ссылку?

import { Component } from '@angular/core';
import { Observable } from 'rxjs/Observable';

import {AngularFirestore, AngularFirestoreCollection, AngularFirestoreDocument} from 'angularfire2/firestore';
import { Http } from '@angular/http';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  private itemsCollection: AngularFirestoreCollection<UserProfiles>;
  items: Observable<UserProfiles[]>;
  constructor(private afs: AngularFirestore) {
    this.itemsCollection = afs.collection<UserProfiles>('UserProfiles');
    this.items = this.itemsCollection.valueChanges();
  }

}

export class UserProfiles{
  id?: string;
  active?: string;
  company?: string;
  email?: string;
  firstName?: string;
  lastName?: string;
  password?: string;
  userId?: string;
  userType?: string;
}

Answer 1

Вам потребуется subscribe() против Observable<UserProfiles[]>;, созданного valueChanges()(), в данном случае свойством класса items, для извлечения / использования данных:

import { Component } from '@angular/core';
import { Observable } from 'rxjs/Observable';

import {AngularFirestore, AngularFirestoreCollection, AngularFirestoreDocument} from 'angularfire2/firestore';
import { Http } from '@angular/http';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  private itemsCollection: AngularFirestoreCollection<UserProfiles>;
  items: Observable<UserProfiles[]>;
  constructor(private afs: AngularFirestore) {
    this.itemsCollection = afs.collection<UserProfiles>('UserProfiles');
    this.items = this.itemsCollection.valueChanges();
    this.items.subscribe(data => console.log(data)); // subscribe and log emitted data
  }

}

В противном случае, ffвы используете items в шаблоне, в качестве одной из опций вы можете использовать канал async для подписки на наблюдаемую items и визуализации данных:

<ul>
  <li *ngFor="let item of items | async">{{item.someProperty}}</li>
</ul>

Надеюсь, это поможет!