Я хочу отобразить «$ key» на странице home.html Чтобы убедиться, что код работает, он показывает строку «snapshotChanges ();»в ионном

Question

Этот код не работает в project.html

$ ключ в html не работает

<p>{{shopadd.$key}}</p>

Импортировать этот файл из project.ts

import { Component } from '@angular/core';
import { NavController ,NavParams } from 'ionic-angular';

import { AngularFireDatabase , AngularFireList } from '@angular/fire/database';

import {AngularFireAuth} from 'angularfire2/auth';
import { Observable } from 'rxjs/Observable';

export class HomePage {

shop : AngularFireList<any>;
shopadd : Observable<any[]>;
constructor(public navCtrl:NavController,public db:AngularFireDatabase,public navParams: NavParams,public auth: AngularFireAuth
){
this.shopadd = this.db.list('market').valueChanges();
this.shopadd = this.shop.snapshotChanges();


  }}

Я хочувыберите данные $ ключ в базе данных

Answer 1

эти два оператора не возвращают ни одного объекта

this.shopadd = this.db.list('market').valueChanges();
this.shopadd = this.shop.snapshotChanges();

Из документации angularfire

valueChanges ()

Что это?Возвращает Observable данных в виде синхронизированного массива объектов JSON.Все метаданные Snapshot удаляются, и только метод предоставляет только данные.

И

snapshotChanges ()

Что такоеЭто?Возвращает Observable данных в виде синхронизированного массива AngularFireAction [].

this.marketItems = this.db.list('market').snapshotChanges().pipe(
  map(results => 
    results.map(r => ({ key: r.payload.key, ...r.payload.val() }))
  )
);

Где-то в вашем html ...

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