Can't resolve all parameters for AngularFirestore: ([object Object], ?)

Question

I've been trying to troubleshoot this error for a while. The error reads Can't resolve all parameters for AngularFirestore: ([object Object], ?) . Has anyone else had this issue, and how were you able to resolve the issue. I've read the docs, and I can't get to the bottom of this issue.

import { Component } from '@angular/core';
import { AngularFirestore } from 'angularfire2/firestore';
import { AngularFireDatabase } from 'angularfire2/database';
import { Observable } from 'rxjs/Observable';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css'],
    providers: [AngularFirestore, AngularFireDatabase]
})
export class AppComponent {
    items: Observable<any[]>;

    constructor(db: AngularFirestore, adb: AngularFireDatabase) {
        this.items = db.collection('0').valueChanges();
        console.log(this.items)

    }
}

package.json

"angularfire2": "^5.0.0-rc.3",
"firebase": "^4.6.0",

Answer 1

I have been getting the same error. It is because you have AngularFirestore listed as a service provider which it is not. But once removed as a provider I get another error :

Error: No provider for AngularFirestore! at injectionError at noProviderError

To fix this error you have to import AngularFirestoreModule into your app.module.ts

Like the following:

import { AngularFirestoreModule } from 'angularfire2/firestore';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    .....
    AngularFireModule.initializeApp(firebaseConfig),
    AngularFirestoreModule <---
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Please remove the arrow behind AngularFirestoreModule it is there just to make it clear where it is supposed to be placed.

Answer 2

you have to import AngularFirestoreModule into your app.module.ts

In imports and providers.

 imports: [
    BrowserModule,
    .....
    AngularFireModule.initializeApp(firebaseConfig),
    AngularFirestoreModule
  ],

providers: [AngularFirestoreModule],
.....

Answer 3

After check imports, issues end. My imports app.module in below:

  imports: [
    BrowserModule,
    AngularFireModule.initializeApp(environment.firebase),
    AngularFirestoreModule,
    AngularFirestoreModule.enablePersistence(),
    AngularFireAuthModule, 
    NgbModule.forRoot(),
    AppRoutingModule,
    HttpModule,
    HttpClientModule,
  ],