最近,我开始学习结合使用firebase和angular的概念。首先,我尝试使登录过程正常进行。当前,当我尝试导航到登录页面时出现一个令人讨厌的错误,并且我无法弄清楚是什么原因导致了该错误。我得到的错误是:
ERROR错误:未捕获(承诺):错误: StaticInjectorError(AppModule)[AngularFireAuth-> InjectionToken angularfire2.app.options]:StaticInjectorError(平台: 核心)[AngularFireAuth-> InjectionToken angularfire2.app.options]: NullInjectorError:没有用于InjectionToken angularfire2.app.options的提供程序!
我该怎么办才能解决此错误?另外,我看到很多使用angularfire2而不是@ angular / fire的代码。这2个和我应该实际使用的有什么区别?
这是我到目前为止的代码:
app.module.ts
List<User> allUsers = new ArrayList<>();
allUsers.addAll(oldUsers);
allUsers.addAll(newUsers);
Optional<User> result = allUsers.stream()
.filter(user -> email.equals(user.email))
.findAny();
login.component.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { AngularFireModule } from '@angular/fire';
import { AngularFireDatabaseModule } from '@angular/fire/database';
import { environment } from 'environments/environment';
import * as firebase from 'firebase/app';
import { AppComponent } from './app.component';
import { FIREBASE_SERVICES } from './core/firebase/services';
import { AUTHENTICATION_GUARDS } from './features/authentication/guards';
import { AUTHENTICATON_ROUTES } from './features/authentication/authentication.route';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { AngularFireAuthModule } from '@angular/fire/auth';
import { DashboardComponent } from './features/dashboard/dashboard/dashboard.component';
import { LogInComponent } from './features/authentication/login/login.component';
import { DASHBOARD_ROUTES } from './features/dashboard/dashboard.route';
firebase.initializeApp(environment.firebase);
@NgModule({
declarations: [
AppComponent,
DashboardComponent,
LogInComponent
],
imports: [
AngularFireModule,
AngularFireDatabaseModule,
AngularFireAuthModule,
BrowserModule,
RouterModule,
FormsModule,
ReactiveFormsModule,
RouterModule.forRoot(AUTHENTICATON_ROUTES),
RouterModule.forRoot(DASHBOARD_ROUTES)
],
providers: [
FIREBASE_SERVICES,
AUTHENTICATION_GUARDS
],
bootstrap: [AppComponent]
})
export class AppModule {
constructor() {
console.log("App module created");
}
}
authentication.service.ts
import { Component } from '@angular/core';
import { Credentials } from '@app/core/firebase/models';
import { AuthenticationService } from '@app/core/firebase/services/authentication.service';
import { Router } from '@angular/router';
@Component({
selector: 'app-log-in',
templateUrl: './login.component.html',
styleUrls: ['./login.component.less']
})
export class LogInComponent {
emailaddress: string = '';
password: string = '';
constructor(private readonly _authenticationService: AuthenticationService,
private readonly _router: Router) {
}
login() {
console.log('log in clicked');
const credentials = new Credentials(this.emailaddress, this.password);
this._authenticationService.login(credentials)
.then(
() => this._router.navigate['/dashboard'],
error => {
console.log(error);
alert(error.message);
}
);
}
}
pacakge.json中的依赖性部分
import { Injectable } from '@angular/core';
import { isNullOrUndefined } from 'util';
import { AngularFireAuth } from '@angular/fire/auth';
import * as firebase from 'firebase/app';
import { Credentials } from '@app/core/firebase/models';
@Injectable()
export class AuthenticationService {
constructor(private readonly _angularFireAuthentication: AngularFireAuth) {
console.log("Authentication Service created");
}
login(credentials: Credentials) {
return new Promise((resolve, reject) => {
this._angularFireAuthentication.auth
.signInWithEmailAndPassword(credentials.emailaddress, credentials.password)
.then(
result => resolve(result),
error => reject(error)
);
});
}
logout() {
return new Promise((resolve, reject) => {
if (this.isUserLoggedIn()) {
this._angularFireAuthentication.auth.signOut();
resolve();
}
else {
reject();
}
});
}
private isUserLoggedIn(): boolean {
return !isNullOrUndefined(firebase.auth().currentUser);
}
}
答案 0 :(得分:3)
您没有正确初始化应用程序。导入model.predict_classes(X_train)
时,需要在此处初始化:
AngularFireModule
更多in the docs。
它以前被称为imports: [
AngularFireModule.initializeApp(yourFirebaseConfig),
AngularFireDatabaseModule,
// ... the rest
],
,但在v5版本中,它们已移至angularfire2
范围。从现在开始,它是@angular
,而不是@angular/fire
。