我尝试使用服务将值从组件保存到Firebase。但是当我使用服务时,我会收到NullInjector错误。我做了所有不属于Internet的事情。导入了所有东西,但它不起作用。我已经尝试导入HttpClientModule,AngularFireDatabase,但没有任何工作。我已经试图完全重新创建该项目的新鲜安装一切。我已经尝试了不同版本的firebase和angular(当前为firebase@7.24.0@angular/fire@6.0.3)。没有任何效果。
这是我的消防服务
import { Injectable } from '@angular/core';
import { AngularFireDatabase } from 'angularfire2/database';
@Injectable({
providedIn: 'root'
})
export class FireserviceService {
constructor(private db: AngularFireDatabase) {
}
create(){
return this.db.list('/shopping-carts').push({
dateCreated:new Date().getTime()
});
}
}
这是我的应用程序模块
import { FireserviceService } from './fireservice.service';
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { environment } from '../environments/environment';
import { AngularFirestore } from '@angular/fire/firestore';
import { AngularFireModule } from '@angular/fire';
import { AngularFirestoreModule } from '@angular/fire/firestore';
import { BrainComponent } from './brain/brain.component';
@NgModule({
declarations: [
AppComponent,
BrainComponent
],
imports: [
BrowserModule,
AppRoutingModule,
AngularFireModule.initializeApp(environment.firebase),
AngularFirestoreModule
],
providers: [
AngularFirestore,
FireserviceService
],
bootstrap: [AppComponent]
})
export class AppModule {
constructor(){
}
}
这是我的责任
import { FireserviceService } from './../fireservice.service';
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'brain',
templateUrl: './brain.component.html',
styleUrls: ['./brain.component.css']
})
export class BrainComponent {
constructor(private cartService: FireserviceService) { }
addToCart(val:any){
console.log(val)
}
}
这是我得到的错误
core.js:6142 ERROR NullInjectorError: R3InjectorError(AppModule)[FireserviceService -> AngularFireDatabase -> AngularFireDatabase -> AngularFireDatabase]:
NullInjectorError: No provider for AngularFireDatabase!
at NullInjector.get (http://localhost:51081/vendor.js:38768:27)
at R3Injector.get (http://localhost:51081/vendor.js:38935:33)
at R3Injector.get (http://localhost:51081/vendor.js:38935:33)
at R3Injector.get (http://localhost:51081/vendor.js:38935:33)
at injectInjectorOnly (http://localhost:51081/vendor.js:32465:33)
at Module.ɵɵinject (http://localhost:51081/vendor.js:32469:61)
at Object.FireserviceService_Factory [as factory] (http://localhost:51081/main.js:280:159)
at R3Injector.hydrate (http://localhost:51081/vendor.js:39103:35)
at R3Injector.get (http://localhost:51081/vendor.js:38924:33)
at NgModuleRef$1.get (http://localhost:51081/vendor.js:53004:33)
在我向brain组件中的构造函数添加参数之前,网站运行良好,但我一添加私家车服务:大脑组件的构造函数中的FireerviceService甚至不会加载HTML。我是Angular 和firebase的新手。我正在尝试将值保存在firebase数据库中。请帮助。
8条答案
按热度按时间dldeef671#
从错误消息中可以看到,依赖项容器缺少AngularFireDatabase的提供程序:
“没有AngularFireDatabase的提供程序”
如果你使用AngularFireDatabase,你需要在提供者的app.module.ts中导入该服务--你目前正在导入AngularFirestore。
l7mqbcuq2#
将HttpClientModule导入到app.module.ts中,并将HttpClientModule添加到导入数组中。
ibps3vxo3#
在服务中检查
@Injectable
注解是否如下所示:a0zr77ik4#
这是因为您正在尝试使用Angular Fire数据库,但在应用程序模块中导入了Angular Firestore模块和Angular Firestore。
在应用程序模块.ts中,将AngularFirestoreModule替换为AngularFireDatabase模块,将AngularFirestore替换为AngularFireDatabase
不过,我会建议使用角火恢复,而不是角火数据库,如果你是开始新的。
https://github.com/angular/angularfire/blob/master/docs/install-and-setup.md
5t7ly7z55#
This thread may help,
如果您使用库并将
firebase
添加为dependency
,则必须使用相同的版本保留这两个位置意思是如果
主应用程序
@我的/库
那么你将面临同样的错误。修复这个问题的方法是将
@another/lib
版本从7.22.0
提升到MainApp
。dependencies
,而应导入peerDependencies
*0lvr5msh6#
我也有同样的问题。我通过从
到
使用中(Angular 13和火灾7.3.0)
pb3s4cty7#
这应该对你有用:
在您的
app.module.ts > imports:[ ]
中替换为:
用这个
7qhs6swi8#
你应该检查一下你是否已经导入了
HttpClientModule
,因为服务通常使用它,而我在你的代码中没有看到它。尝试一下并给予我一些反馈!我也遇到过同样的问题,我通过导入HttpClientModule
解决了它我已经把它导入到app.module里了,像这样
并且您还应该检查是否有
@Injectable
装饰器,其中providedIn: 'root'
位于服务类中,如下所示