在 HTML 中显示 FirebaseListObservable答案

【问题标题】：Display FirebaseListObservable in HTML在 HTML 中显示 FirebaseListObservable
【发布时间】：2017-12-11 20:47:53
【问题描述】：

我是 Firebase 的新手，我对 Firebaselistobservable 有疑问。我可以在 HTML 中显示 $key。但是有没有可能我也可以显示数字 1 / 2 / 3 / 4 ？我在下面添加了一些图片。如果有人可以帮助我，我会非常高兴。我什至不确定这是否可能。

Firebaselistobservable Console.log
Datas in Firebase

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { AlertController } from 'ionic-angular';
import { FirebaseProvider } from '../../providers/firebase/firebase';
import { AngularFireAuth } from 'angularfire2/auth';
import { Observable } from 'rxjs/Observable';
import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database';
import * as firebase from 'firebase/app';
@Component({
  selector: 'page-daten',
  templateUrl: 'daten.html'
})
export class DatenPage {
  Daten: FirebaseListObservable<any[]>;
  tageszeiten: FirebaseListObservable<any[]>;
  genau: FirebaseListObservable<any[]>;
  Datum: '';
  tageszeit: '';

  constructor(public navCtrl: NavController, public alertCtrl : AlertController,  public fp: FirebaseProvider, public af: AngularFireDatabase, public afAuth: AngularFireAuth) {
    this.Daten = this.fp.getMessungenDaten();
    this.Daten.forEach(datum => {
      console.log('Item:', datum);
   
  });
}
  
}

  <ion-list> 
   <ion-item block on-click="goToNotfallNummernAnzeige(item.newName, item.eNummer);"  *ngFor="let datum of Daten | async">
     {{datum.$key}}
     <ion-item-sliding>
     <ion-item>
       Here i would like to display (1/2/3/4)
     </ion-item>
     <ion-item-options side="left">
       <button ion-button color="danger">delete</button>
     </ion-item-options>
    </ion-item-sliding>
   </ion-item>
   </ion-list>

最后应该是这样的：
What it should look like

【问题讨论】：

发布您的代码而不是图片

标签： angular firebase ionic-framework hybrid-mobile-app

【解决方案1】：

您应该能够通过密钥直接访问它们，因为您的密钥是“1”、“2”、“3”和“4”。这不灵活，但您的数据似乎总是结构相同。

类似的东西

<ion-item>
    1 {{datum["1"].blutzuckerwert}}
    2 {{datum["2"].blutzuckerwert}}
    3 {{datum["3"].blutzuckerwert}}
    4 {{datum["4"].blutzuckerwert}}
</ion-item>

【讨论】：