离子模板上的Angularfire2 5.0 Firebase数据显示查询

时间:2018-07-26 07:51:16

标签: angular typescript firebase ionic-framework

大家好,我在使用angularfire2 v 5.0时遇到问题。我用了一段时间  v 4.0,现在我正在尝试使用v 5.0编程并遇到一些问题。

如何在ionic 3.0的标签/输入中显示Firebase实时数据?我以前不了解v 4.0的订阅问题。使用代码时,我可以显示在console.log上,但不能显示在模板上。

import { Component, ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { AngularFireDatabase } from 'angularfire2/database';
import { Observable } from 'rxjs';

@Component({
  selector: 'page-keyboard',
  templateUrl: 'keyboard.html',
})

export class KeyboardPage {


 userNachna: Text;
  constructor(
    public navCtrl: NavController, 
    public navParams: NavParams,
    public databaseFirebase: AngularFireDatabase,   
  ) {

  }

loadDataFirebase(){
this.databaseFirebase.object('/test/').snapshotChanges()
  .subscribe(action => {
    console.log(action.type);                <-- WORKS
    console.log(action.key)                  <-- WORKS
    console.log(action.payload.val())        <-- WORKS
    this.userNachna = action.payload.val();  <-- HERE THE ERROR
  });
}

我的模板IONIC 3.0:

<ion-input type="text" #userNachna></ion-input>

1 个答案:

答案 0 :(得分:0)

模板可能看起来应该相似:

<ion-input type="text" value="{{action.payload.value}}></ion-input>