я пытаюсь следовать учебному пособию по угловой / пожарной базе для моего класса.(вы можете найти его здесь https://www.barbarianmeetscoding.com/blog/2017/06/09/from-idea-to-reality-in-under-50-minutes-mostly-with-angular-and-firebase/) Я следую за ним слово за словом, но я получаю ошибку при импорте FirebaseListObservable в моем компоненте, он говорит, что у него нет экспортированного члена, я просмотрел все подобные вопросы, но не могу найтирешение.
Мой компонент:
import { Component, OnInit } from '@angular/core';
import { Baby } from '../baby';
import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database';
import { RandomPickerService } from '../random-picker.service';
@Component({
selector: 'app-babies',
templateUrl: './babies.component.html',
styleUrls: ['./babies.component.css']
})
export class BabiesComponent implements OnInit {
babies: FirebaseListObservable<Baby[]>;
constructor(private db: AngularFireDatabase, private randomService: RandomPickerService) { }
ngOnInit() {
this.babies = this.db.list('/babies');
}
// create new baby!
giveBirth() {
// create new baby!
const newBaby = new Baby(this.pickRandomName());
const babies = this.db.list('/babies');
babies.push(newBaby);
}
pickRandomName() {
const names = ['Erik', 'Nicolas', 'Fabian', 'Jaime', 'Anderson', 'Luisa', 'Laura', 'Gustavo', 'Chicuazuque', 'Felipe', 'Juan', 'Jose'];
return this.randomService.pickAtRandom(names);
}
}
Мой модуль маршрутизации это:
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { BabiesComponent } from './babies/babies.component'
const routes: Routes = [
{
path: 'babies',
children: [{
path: '',
component: BabiesComponent
}],
},
{
path: '**',
redirectTo: 'babies'
}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
и мой модуль приложения это:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FirebaseApp } from 'angularfire2';
import { AppComponent } from './app.component';
import { BabiesComponent } from './babies/babies.component';
import { AppRoutingModule } from './/app-routing.module';
import { HttpModule, Http } from '@angular/http';
import { AngularFireModule } from 'angularfire2';
import { AngularFireDatabaseModule } from 'angularfire2/database';
import { RandomPickerService } from './random-picker.service';
// Environment configuration
import { environment } from '../environments/environment';
@NgModule({
declarations: [
AppComponent,
BabiesComponent,
],
imports: [
BrowserModule,
AppRoutingModule,
AngularFireModule.initializeApp(environment.firebase),
AngularFireDatabaseModule,
HttpModule
],
bootstrap: [AppComponent],
providers: [RandomPickerService]
})
export class AppModule { }