Я получаю следующую ошибку при попытке использовать AngularFireModule.
main.ts:13 TypeError: Object(...) is not a function
at new AngularFireModule (angular-fire.js:372)
at Object.AngularFireModule_Factory [as factory] (angular-fire.js:391)
at R3Injector.hydrate (core.js:17053)
at R3Injector.get (core.js:16803)
at core.js:16849
at Set.forEach (<anonymous>)
at R3Injector._resolveInjectorDefTypes (core.js:16845)
at new NgModuleRef$1 (core.js:36441)
at NgModuleFactory$1.create (core.js:36540)
Я видел решение здесь , которое включает обновление rx js и rx js -компат, но ошибка все еще присутствует. Я включу мои зависимости, модуль приложения и службу аутентификации ниже. Буду признателен за любую помощь.
пакет. json
"dependencies": {
"@angular/animations": "~9.1.3",
"@angular/cdk": "~9.2.1",
"@angular/common": "~9.1.3",
"@angular/compiler": "~9.1.3",
"@angular/core": "^9.1.3",
"@angular/fire": "latest",
"@angular/forms": "~9.1.3",
"@angular/material": "^9.2.1",
"@angular/platform-browser": "^9.1.3",
"@angular/platform-browser-dynamic": "~9.1.3",
"@angular/router": "~9.1.3",
"angularfire2": "^5.4.2",
"body-parser": "^1.19.0",
"express": "^4.17.1",
"firebase": "^6.6.2",
"moment": "^2.24.0",
"mongodb": "^3.5.4",
"mongoose": "^5.9.2",
"promise-polyfill": "8.1.3",
"rxjs": "^6.4.0",
"rxjs-compat": "^6.5.5",
"tslib": "^1.10.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.901.3",
"@angular/cli": "~9.1.3",
"@angular/compiler-cli": "~9.1.3",
"@angular/language-service": "~9.1.3",
"@types/node": "^12.11.1",
"@types/jasmine": "~3.3.8",
"@types/jasminewd2": "~2.0.3",
"codelyzer": "^5.1.2",
"jasmine-core": "~3.4.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.1.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~2.0.1",
"karma-jasmine-html-reporter": "^1.4.0",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.15.0",
"typescript": "~3.8.3"
}
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { AngularFireModule } from '@angular/fire';
import { AngularFireAuth, AngularFireAuthModule } from '@angular/fire/auth';
import { AngularFirestoreModule } from '@angular/fire/firestore';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { VenueComponent } from './venue';
import { LoginComponent } from './login';
import { RegisterComponent } from './register';
import { JwtInterceptor, ErrorInterceptor } from './_helpers';
import { AlertComponent } from './_components';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MaterialModule } from './material.module';
import { PlayerComponent } from './player';
import { UserMusicComponent } from './user-music';
import { MapComponent } from './map';
import { SetVenueComponent } from './set-venue';
import { MusicPreferencesComponent } from './music-preferences';
import { RecommendedVenuesComponent } from './recommended-venues';
import { SelectMusicComponent } from './select-music';
import { PaymentComponent } from './payment';
import { AccountComponent } from './account';
import { AuthenticationService } from './_services';
const firebaseConfig = {
apiKey: 'XXXXXXXXXXXXXX',
authDomain: 'XXXXXXXXXXXX',
databaseURL: 'XXXXXXXXXXX',
projectId: 'XXXXXXXXXXXXXX',
storageBucket: 'XXXXXXXXXXXXX',
messagingSenderId: 'XXXXXXXXXXX',
appId: 'XXXXXXXXXXXXXXXXXXXXX',
measurementId: 'XXXXXXXXXXX'
};
@NgModule({
declarations: [
AppComponent,
VenueComponent,
LoginComponent,
RegisterComponent,
AlertComponent,
PlayerComponent,
UserMusicComponent,
MapComponent,
SetVenueComponent,
MusicPreferencesComponent,
RecommendedVenuesComponent,
SelectMusicComponent,
PaymentComponent,
AccountComponent
],
imports: [
BrowserModule,
AppRoutingModule,
ReactiveFormsModule,
HttpClientModule,
BrowserAnimationsModule,
AngularFireModule.initializeApp(firebaseConfig),
AngularFireAuthModule,
AngularFirestoreModule,
MaterialModule
],
providers: [
{ provide: HTTP_INTERCEPTORS, useClass: JwtInterceptor, multi: true },
{ provide: HTTP_INTERCEPTORS, useClass: ErrorInterceptor, multi: true },
AuthenticationService
],
bootstrap: [AppComponent]
})
export class AppModule { }
Authentication.service.ts
import { Injectable, NgZone } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { BehaviorSubject, Observable } from 'rxjs';
import { Router } from '@angular/router';
import { AngularFireAuth } from '@angular/fire/auth';
import { AngularFirestore, AngularFirestoreDocument } from '@angular/fire/firestore';
import { User } from '../_interfaces/user';
import * as firebase from 'firebase/app';
@Injectable({ providedIn: 'root' })
export class AuthenticationService {
private currentUserSubject: BehaviorSubject<any>;
public currentUser: Observable<any>;
user: Observable<firebase.User>;
returnUrl: string;
constructor(private http: HttpClient,
public afs: AngularFirestore,
public afAuth: AngularFireAuth,
public router: Router,
public ngZone: NgZone
) {
this.afAuth.authState.subscribe(user => {
if (user) {
this.user = this.afAuth.authState;
localStorage.setItem('currentUser', JSON.stringify(this.user));
JSON.parse(localStorage.getItem('currentUser'));
} else {
localStorage.setItem('currentUser', null);
JSON.parse(localStorage.getItem('currentUser'));
}
});
this.currentUserSubject = new BehaviorSubject<any>(JSON.parse(localStorage.getItem('currentUser')));
this.currentUser = this.currentUserSubject.asObservable();
}
public get currentUserValue() {
return this.currentUserSubject.value;
}
login(email, password) {
this.afAuth.signInWithEmailAndPassword(email, password).then((result) => {
this.ngZone.run(() => {
this.router.navigate([this.returnUrl]);
});
this.setUser(result.user);
}).catch((error) => {
window.alert(error.message)
})
;
}
logout() {
// remove user from local storage and set current user to null
localStorage.removeItem('currentUser');
this.currentUserSubject.next(null);
}
register(email: string, password: string) {
this.afAuth.createUserWithEmailAndPassword(email, password).then(
value => {
console.log('Successfully registered ', value);
this.setUser(value.user);
})
.catch(err => {
console.log('Something went wrong:', err.message);
});
}
forgotPassword(passwordResetEmail) {
return this.afAuth.sendPasswordResetEmail(passwordResetEmail)
.then(() => {
window.alert('Password reset email sent, check your inbox.');
}).catch((error) => {
window.alert(error);
});
}
setUser(user) {
const userRef: AngularFirestoreDocument<any> = this.afs.doc(`users/${user.uid}`);
const userData: User = {
uid: user.uid,
email: user.email,
displayName: user.displayName,
photoURL: user.photoURL,
emailVerified: user.emailVerified,
gender: user.gender,
age: user.age,
musicPreferences: user.musicPreferences,
recentVenues: user.recentVenues,
userType: user.userType
};
return userRef.set(userData, {
merge: true
});
}
}