Question

晚上好，我在标题中写了错误，因此很容易知道问题是什么所以我是新的离子和firebase世界我正在尝试做一个简单的聊天应用程序，其中包括用户输入他的昵称的登录页面，之后他将被发送到他可以的房间页面加入任何房间开始聊天它工作正常我能够让一些人聊天和创建房间，然后我决定通过添加一个注册和登录页面使用始终firebase的身份验证系统，使它更好一点注册和登录的部分工作正常，用户登录应用程序后发送到他可以把他的昵称问题的页面，当他这样做，按下按钮我得到这个错误，它让我疯了

WEBPACK_IMPORTED_MODULE_4_firebase_app .database不是函数

以下是此

背后的代码

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { AddRoomPage } from '../add-room/add-room';
import { HomePage } from '../home/home';
import * as firebase from 'firebase/app';
import { TranslateService } from '@ngx-translate/core';

/**
 * Generated class for the RoomPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-room',
  templateUrl: 'room.html',
})
export class RoomPage {


	rooms =[];
	ref = firebase.database().ref('chatrooms/');
	
  constructor(public navCtrl: NavController, public navParams: NavParams, translate: TranslateService) {
    translate.setDefaultLang(window.navigator.language);
    //translate.setDefaultLang('fr');
  	this.ref.on('value', resp =>{
  		this.rooms = [];
  		this.rooms = snapshotToArray(resp);
  	});
  }

  addRoom(){
  	this.navCtrl.push(AddRoomPage);
  }
  joinRoom(key){
  	this.navCtrl.setRoot(HomePage, {
  		key:key,
  		nickname:this.navParams.get("nickname")
  	});
  }
  ionViewDidLoad() {
    console.log('ionViewDidLoad RoomPage');
  }

}
export const snapshotToArray = snapshot => {
	let returnArr = [];

	snapshot.forEach(childSnapshot =>{
		let item = childSnapshot.val();
		item.key = childSnapshot.key;
		returnArr.push(item);
	});
	return returnArr;
}

<ion-header>
  <ion-navbar>
    <ion-title>{{ 'Room' | translate }}</ion-title>
    <ion-buttons end>
      <button ion-button icon-only (click)="addRoom()">
        <ion-icon name="add-circle"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <ion-list>
    <ion-item *ngFor="let room of rooms">
      {{room.roomname}}
      <ion-icon name="chatboxes" item-end (click)="joinRoom(room.key)"></ion-icon>
    </ion-item>
  </ion-list>
</ion-content>

ref = firebase.database().ref('chatrooms/');

Answer 1

将import * as firebase from 'firebase/app';替换为import * as firebase from 'firebase';

Ionic，firebase __WEBPACK_IMPORTED_MODULE_4_firebase_app __。数据库不是函数

1 个答案: