在 HTML 中显示 FirebaseListObservable
Display FirebaseListObservable in HTML
我是 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
您应该可以直接通过密钥访问它们,因为您的密钥是“1”、“2”、“3”和“4”。这不灵活,但您的数据似乎总是
结构相同
像这样
<ion-item>
1 {{datum["1"].blutzuckerwert}}
2 {{datum["2"].blutzuckerwert}}
3 {{datum["3"].blutzuckerwert}}
4 {{datum["4"].blutzuckerwert}}
</ion-item>
我是 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
您应该可以直接通过密钥访问它们,因为您的密钥是“1”、“2”、“3”和“4”。这不灵活,但您的数据似乎总是 结构相同
像这样
<ion-item>
1 {{datum["1"].blutzuckerwert}}
2 {{datum["2"].blutzuckerwert}}
3 {{datum["3"].blutzuckerwert}}
4 {{datum["4"].blutzuckerwert}}
</ion-item>