Не удается подключиться к AngularFireDatabase

Question

Я пытаюсь создать приложение Angular, которое извлекает данные из базы данных NoSQL Firebase в реальном времени, используя последнюю версию модуля AngularFire.Я следовал документам, изложенным https://github.com/angular/angularfire2/blob/master/docs/install-and-setup.md, а также https://github.com/angular/angularfire2/blob/master/docs/rtdb/lists.md. Однако, когда я запускаю ng serve, я вижу только пустую страницу, и эта ошибка в консоли повторяется дважды: NullInjectorError: No provider for AngularFireDatabase!

Я прошел через все документы, и они кажутся более понятными для подключения к Firestore, чем к Firebase, и мне не так легко следовать.Буду очень признателен за помощь или отзыв о том, что я могу делать неправильно.

Вот мой app.module.ts файл:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { AngularFireModule } from '@angular/fire';
import { environment } from '../environments/environment';
import { AngularFirestoreModule } from '@angular/fire/firestore';
import { AngularFireStorageModule } from '@angular/fire/storage';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AngularFireModule.initializeApp(environment.firebase),
    AngularFirestoreModule,
    AngularFireStorageModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.component.ts файл:

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  study_items: Observable<any[]>;
  constructor(db: AngularFireDatabase) {
     this.study_items = db.list('study_items').valueChanges(); 
//      console.log(this);
  }
}

Файл environment.ts :

export const environment = {
  production: false,
  firebase: {
    apiKey: '<my api key because I am not showing it>',
    authDomain: 'my-firebase-demo.firebaseapp.com',
    databaseURL: 'https://my-firebase-demo.firebaseio.com',
    projectId: 'my-firebase-demo',
    storageBucket: 'my-firebase-demo.appspot.com',
    messagingSenderId: '<somenumber>'
  }
};

и, наконец, приложение .component.html file

<ul>
  <li class="text" *ngFor = "let unit of study_items | async">
    {{ unit | json }}
  </li>
</ul>