我在角度4上安装firebase,然后将其添加到app-module上 并且在环境中获取配置脚本我也改变了我将真实地从rull改为true
并在组件i中导入AngularFireDatabase 并写下
app-module
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {AngularFireModule} from 'angularfire2';
import {AngularFireDatabaseModule} from 'angularfire2/database';
import {environment} from '../environments/environment';
import { AppComponent } from './app.component';
import { UsersComponent } from './component/users/users.component';
@NgModule({
declarations: [
AppComponent,
UsersComponent
],
imports: [
BrowserModule,
AngularFireModule.initializeApp(environment.firebase),
AngularFireDatabaseModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
enviromnet
export const environment = {
production: false
firecase:{
apiKey: "AIzaSyCD3yDwF7qBcepnAXEspXbfchMtaGncHtg",
authDomain: "courses-4d546.firebaseapp.com",
databaseURL: "https://courses-4d546.firebaseio.com",
projectId: "courses-4d546",
storageBucket: "courses-4d546.appspot.com",
messagingSenderId: "760508178350"
}
};
组件
import { Component, OnInit } from '@angular/core';
import {AngularFireDatabase } from 'angularfire2/database';
@Component({
selector: 'app-users',
templateUrl: './users.component.html',
styleUrls: ['./users.component.css']
})
export class UsersComponent implements OnInit {
courses: any[];
constructor(db: AngularFireDatabase) {
db.list('/courses')
.subscribe(courses =>{
this.courses=courses;
console.log(this.courses);
})
}
ngOnInit() {
}
}
我有错误 无法读取未定义[![在此处输入图像说明] [1]] [1]
的属性'databaseURL'AppComponent.html:2 ERROR TypeError: Cannot read property 'databaseURL' of undefined
at RepoManager.databaseFromApp (index.cjs.js:14981)
at Object.instance.INTERNAL.registerService.Reference [as database] (index.cjs.js:15328)
at FirebaseAppImpl._getService (index.cjs.js:134)
at FirebaseAppImpl.(:4200/anonymous function) [as database] (webpack-internal:///./node_modules/@firebase/app/dist/index.cjs.js:323:31)
at eval (database.js:11)
at ZoneDelegate.invoke (zone.js:388)
at Zone.run (zone.js:138)
at NgZone.runOutsideAngular (core.js:4708)
at new AngularFireDatabase (database.js:9)
at _createClass (core.js:10943)
答案 0 :(得分:2)
在您的文件app-module中调用此
AngularFireModule.initializeApp(environment.firebase),
所以你需要在环境中使 firebase 而不是 firecase 所以你的环境必须看起来像
export const environment = {
production: false
firebase:{
apiKey: "AIzaSyCD3yDwF7qBcepnAXEspXbfchMtaGncHtg",
authDomain: "courses-4d546.firebaseapp.com",
databaseURL: "https://courses-4d546.firebaseio.com",
projectId: "courses-4d546",
storageBucket: "courses-4d546.appspot.com",
messagingSenderId: "760508178350"
}
};
答案 1 :(得分:1)
我今天遇到了同样的问题,并以一种方式解决了。您将Firebase配置放置在environment.ts
文件中。而不是像这样将数据放在app.module.ts
中。
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {AngularFireModule} from 'angularfire2';
import {AngularFireDatabaseModule} from 'angularfire2/database';
import {environment} from '../environments/environment';
import { AppComponent } from './app.component';
import { UsersComponent } from './component/users/users.component';
export const firebaseConfig = {
apiKey: "AIzaSyCD3yDwF7qBcepnAXEspXbfchMtaGncHtg",
authDomain: "courses-4d546.firebaseapp.com",
databaseURL: "https://courses-4d546.firebaseio.com",
projectId: "courses-4d546",
storageBucket: "courses-4d546.appspot.com",
messagingSenderId: "760508178350"
}
@NgModule({
declarations: [
AppComponent,
UsersComponent
],
imports: [
BrowserModule,
AngularFireModule.initializeApp(firebaseConfig),
AngularFireDatabaseModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
这可行,但是我不知道解决databaseURL
错误的确切方法。
答案 2 :(得分:0)