Question

我正在学习使用Ionic和AngularFire2创建聊天应用程序的教程。

但是，当我尝试从Firebase数据库检索数据时，我遇到此错误。

TypeError: Object(...) is not a function
at SwitchMapSubscriber.project (http://localhost:8100/build/vendor.js:74005:76)
at SwitchMapSubscriber._next (http://localhost:8100/build/vendor.js:62295:27)
at SwitchMapSubscriber.Subscriber.next (http://localhost:8100/build/vendor.js:20750:18)
at RefCountSubscriber.Subscriber._next (http://localhost:8100/build/vendor.js:20786:26)
at RefCountSubscriber.Subscriber.next (http://localhost:8100/build/vendor.js:20750:18)
at Subject.next (http://localhost:8100/build/vendor.js:23237:25)
at ConnectableSubscriber.Subscriber._next (http://localhost:8100/build/vendor.js:20786:26)
at ConnectableSubscriber.Subscriber.next (http://localhost:8100/build/vendor.js:20750:18)
at Notification.observe (http://localhost:8100/build/vendor.js:51893:50)
at AsyncAction.DelaySubscriber.dispatch (http://localhost:8100/build/vendor.js:76316:40)

我的Chat.TS代码

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

/**
 * Generated class for the ChatPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-chat',
  templateUrl: 'chat.html',
})
export class ChatPage {

  username: string = '';
  message : string = '';
  //messages : object[] = [];
  items: Observable<any[]>;

  constructor(public db: AngularFireDatabase , public navCtrl: NavController, public navParams: NavParams) {
    console.log(this.navParams);
    this.username = this.navParams.get('username');
    this.items = db.list('chat').valueChanges();
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad ChatPage');
  }

  sendMessage(){
    this.db.list('/chat').push({
      username:this.username,
      message:this.message
    });
  }
}

我的Chat.HTML代码

<ion-header>

  <ion-navbar>
    <ion-title>Chat</ion-title>
  </ion-navbar>

</ion-header>



<ion-content padding>

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

</ion-content>


<ion-footer>
  <ion-toolbar>
    <ion-input type="text" [(ngModel)]="message"></ion-input>
    <button ion-button icon-only (click)="sendMessage()"><ion-icon name="send"></ion-icon>
    </button>
  </ion-toolbar>
</ion-footer>

我尝试了很多不同的方法，但仍然遇到同样的对象错误。任何人都知道导致此错误的原因是什么？谢谢你的帮助。

使用ionic + angularfire2从Firebase检索数据时出现问题

0 个答案: