Home > Back-end >  Getting an injection error when called from constructor in Angular
Getting an injection error when called from constructor in Angular

Time:10-29

I'm getting a NG0203 runtime error: Error: NG0203: inject() must be called from an injection context such as a constructor

The error is happening within the constructor of my class, which I thought was within an injection context, per the error above. Here is my code:

import { Component } from '@angular/core';
import { AngularFireDatabase } from '@angular/fire/compat/database'


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  courses!: any[];

  constructor(db: AngularFireDatabase){
  //   db.list('/courses').valueChanges()
  //     .subscribe(courses => {
  //       this.courses = courses;
  //       console.log(this.courses)
  //     })
  }
} 

The error goes away if I comment out that constructor. So clearly something is wrong with my calling an injector with AngularFireDataBase, but I can't quite figure it out.

Here is my app module:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent } from './app.component';

import { FIREBASE_OPTIONS } from '@angular/fire/compat';
import { AngularFireDatabaseModule } from '@angular/fire/compat/database';
import { environment } from '../environments/environment';

import { provideFirebaseApp, initializeApp } from '@angular/fire/app'


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    provideFirebaseApp(() => initializeApp(environment.firebase)),
    AngularFireDatabaseModule
  ],
  providers: [
    {
      provide: FIREBASE_OPTIONS, useValue: environment.firebase
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

As far as I can tell, I'm importing it my app module and in my component. And I'm calling that injector from inside of a constructor. So why would I be getting this error.

Thanks in advance for any help.

CodePudding user response:

You need to provide AngularFireDatabase in provider. It will resolve the issue.

  • Related