Question

我正在尝试使用角度4和angularFire 2构建应用程序。我的anuglar 4 app配置是。

@angular/cli: 1.1.0
node: 6.10.3
os: win32 x64
@angular/animations: 4.1.2
@angular/common: 4.1.2
@angular/compiler: 4.1.2
@angular/compiler-cli: 4.1.2
@angular/core: 4.1.2
@angular/forms: 4.1.2
@angular/http: 4.1.2
@angular/platform-browser: 4.1.2
@angular/platform-browser-dynamic: 4.1.2
@angular/platform-server: 4.1.2
@angular/router: 4.1.2

应用程序编译没有任何问题，并加载除具有AngularFireAuth引用的页面之外的所有其他页面。单击使用AngularFireAuth中断的页面时，将在控制台中记录以下错误。

node_modules/@angular/core//bundles/core.umd.js:1091 ERROR Error: Uncaught (in promise): Error: No provider for InjectionToken FirebaseAppConfigToken!
Error: No provider for InjectionToken FirebaseAppConfigToken!
    at injectionError (node_modules/@angular/core//bundles/core.umd.js:1238)
    at noProviderError (node_modules/@angular/core//bundles/core.umd.js:1276)
    at ReflectiveInjector_._throwOrNull (node_modules/@angular/core//bundles/core.umd.js:2777)
    at ReflectiveInjector_._getByKeyDefault (node_modules/@angular/core//bundles/core.umd.js:2816)
    at ReflectiveInjector_._getByKey (node_modules/@angular/core//bundles/core.umd.js:2748)
    at ReflectiveInjector_.get (node_modules/@angular/core//bundles/core.umd.js:2617)
    at AppModuleInjector.get (ng:///AppModule/module.ngfactory.js:164)
    at AppModuleInjector.get (ng:///AppModule/module.ngfactory.js:174)
    at AppModuleInjector.get (ng:///AppModule/module.ngfactory.js:219)
    at AppModuleInjector.getInternal (ng:///AppModule/module.ngfactory.js:395)
    at injectionError (node_modules/@angular/core//bundles/core.umd.js:1238)
    at noProviderError (node_modules/@angular/core//bundles/core.umd.js:1276)
    at ReflectiveInjector_._throwOrNull (node_modules/@angular/core//bundles/core.umd.js:2777)
    at ReflectiveInjector_._getByKeyDefault (node_modules/@angular/core//bundles/core.umd.js:2816)
    at ReflectiveInjector_._getByKey (node_modules/@angular/core//bundles/core.umd.js:2748)
    at ReflectiveInjector_.get (node_modules/@angular/core//bundles/core.umd.js:2617)
    at AppModuleInjector.get (ng:///AppModule/module.ngfactory.js:164)
    at AppModuleInjector.get (ng:///AppModule/module.ngfactory.js:174)
    at AppModuleInjector.get (ng:///AppModule/module.ngfactory.js:219)
    at AppModuleInjector.getInternal (ng:///AppModule/module.ngfactory.js:395)
    at resolvePromise (zone.js:757)
    at resolvePromise (zone.js:728)
    at zone.js:805
    at ZoneDelegate.invokeTask (zone.js:414)
    at Object.onInvokeTask (node_modules/@angular/core//bundles/core.umd.js:4126)
    at ZoneDelegate.invokeTask (zone.js:413)
    at Zone.runTask (zone.js:181)
    at drainMicroTaskQueue (zone.js:574)
    at HTMLAnchorElement.ZoneTask.invoke (zone.js:480)

我没有找到任何关于这个问题的线索。非常感谢任何帮助！

服务：

import * as firebase from 'firebase/app';
import { AngularFireAuthModule, AngularFireAuth } from 'angularfire2/auth';
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable'; 

@Injectable()
export class AdminService   {  
    private authUser:any;
    private authState:any;
    private loggedInUser:any;
    userLoggedin:boolean=false;
       constructor(public afAuth: AngularFireAuth) { 
             this.afAuth.authState.subscribe((auth) => {
              this.authState = auth;
              console.log(this.authState);
            });
    }


    login(loginEmail:string,loginPassword:string){
        this.afAuth.auth.signInWithEmailAndPassword(loginEmail,loginPassword)
        .catch(function(error){
            alert(" unable to login.Try again");
        });
    }
}

谢谢

Answer 1

您需要添加： AngularFireModule。的 initializeApp（environment.firebase）下，使用AppModule中的项目正确配置firebase。

Answer 2

请确保您的Firebase配置正确并且您在模块中正确传入，因此app.module.ts看起来像这样：

 import { AngularFireModule } from 'angularfire2';
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { AppComponent } from './app.component';

    export const firebaseConfig = {
    //fill this data with the data you get from the firebase console
    apiKey: "",
    authDomain: "",
    databaseURL: "",
    projectId: "",
    storageBucket: ",
    messagingSenderId: ""
}
    @NgModule({
      imports: [
        BrowserModule,
        AngularFireModule.initializeApp(firebaseConfig)
      ],
      declarations: [ AppComponent ],
      bootstrap: [ AppComponent ]
    })
    export class AppModule {}

修改这是使用angularfire2

进行注册，登录和注销的服务
import { Injectable } from '@angular/core'; import { AngularFireAuth } from 'angularfire2/auth'; import * as firebase from 'firebase/app'; import { Observable } from 'rxjs/Observable'; @Injectable() export class AuthService { user: Observable<firebase.User>; constructor(private firebaseAuth: AngularFireAuth) { this.user = firebaseAuth.authState; } signup(email: string, password: string) { this.firebaseAuth .auth .createUserWithEmailAndPassword(email, password) .then(value => { console.log('Success!', value); }) .catch(err => { console.log('Something went wrong:',err.message); }); } login(email: string, password: string) { this.firebaseAuth .auth .signInWithEmailAndPassword(email, password) .then(value => { console.log('Nice, it worked!'); }) .catch(err => { console.log('Something went wrong:',err.message); }); } logout() { this.firebaseAuth .auth .signOut(); } }

没有提供者为InjectionToken FirebaseAppConfigToken！ Angular 4，AngularFire2

2 个答案: