ログインを実装しようとすると、次のエラーが発生し続けます。
browser_adapter.ts:82EXCEPTION: Error in http://localhost:4200/app/app.component.js class AppComponent_Host - inline template:0:0BrowserDomAdapter.logError @ browser_adapter.ts:82BrowserDomAdapter.logGroup @ browser_adapter.ts:93ExceptionHandler.call @ exception_handler.ts:58(anonymous function) @ application_ref.ts:289ZoneDelegate.invoke @ zone.js:323onInvoke @ ng_zone_impl.ts:72ZoneDelegate.invoke @ zone.js:322Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356onInvokeTask @ ng_zone_impl.ts:61ZoneDelegate.invokeTask @ zone.js:355Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426
browser_adapter.ts:82ORIGINAL EXCEPTION: No provider for AngularFire!BrowserDomAdapter.logError @ browser_adapter.ts:82ExceptionHandler.call @ exception_handler.ts:70(anonymous function) @ application_ref.ts:289ZoneDelegate.invoke @ zone.js:323onInvoke @ ng_zone_impl.ts:72ZoneDelegate.invoke @ zone.js:322Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356onInvokeTask @ ng_zone_impl.ts:61ZoneDelegate.invokeTask @ zone.js:355Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426
browser_adapter.ts:82ORIGINAL STACKTRACE:BrowserDomAdapter.logError @ browser_adapter.ts:82ExceptionHandler.call @ exception_handler.ts:74(anonymous function) @ application_ref.ts:289ZoneDelegate.invoke @ zone.js:323onInvoke @ ng_zone_impl.ts:72ZoneDelegate.invoke @ zone.js:322Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356onInvokeTask @ ng_zone_impl.ts:61ZoneDelegate.invokeTask @ zone.js:355Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426
browser_adapter.ts:82Error: DI Exception
at NoProviderError.BaseException [as constructor] (exceptions.ts:21)
at NoProviderError.AbstractProviderError [as constructor] (reflective_exceptions.ts:59)
at new NoProviderError (reflective_exceptions.ts:92)
at ReflectiveInjector_._throwOrNull (reflective_injector.ts:849)
at ReflectiveInjector_._getByKeyDefault (reflective_injector.ts:878)
at ReflectiveInjector_._getByKey (reflective_injector.ts:840)
at ReflectiveInjector_.get (reflective_injector.ts:633)
at NgModuleInjector.get (ng_module_factory.ts:99)
at DebugAppView._View_AppComponent_Host0.createInternal (AppComponent.ngfactory.js:16)
at DebugAppView.AppView.create (view.ts:112)BrowserDomAdapter.logError @ browser_adapter.ts:82ExceptionHandler.call @ exception_handler.ts:75(anonymous function) @ application_ref.ts:289ZoneDelegate.invoke @ zone.js:323onInvoke @ ng_zone_impl.ts:72ZoneDelegate.invoke @ zone.js:322Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356onInvokeTask @ ng_zone_impl.ts:61ZoneDelegate.invokeTask @ zone.js:355Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426
browser_adapter.ts:82ERROR CONTEXT:BrowserDomAdapter.logError @ browser_adapter.ts:82ExceptionHandler.call @ exception_handler.ts:79(anonymous function) @ application_ref.ts:289ZoneDelegate.invoke @ zone.js:323onInvoke @ ng_zone_impl.ts:72ZoneDelegate.invoke @ zone.js:322Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356onInvokeTask @ ng_zone_impl.ts:61ZoneDelegate.invokeTask @ zone.js:355Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426
browser_adapter.ts:82DebugContext {_view: _View_AppComponent_Host0, _nodeIndex: 0, _tplRow: 0, _tplCol: 0}BrowserDomAdapter.logError @ browser_adapter.ts:82ExceptionHandler.call @ exception_handler.ts:80(anonymous function) @ application_ref.ts:289ZoneDelegate.invoke @ zone.js:323onInvoke @ ng_zone_impl.ts:72ZoneDelegate.invoke @ zone.js:322Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356onInvokeTask @ ng_zone_impl.ts:61ZoneDelegate.invokeTask @ zone.js:355Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426
zone.js:461 Unhandled Promise rejection: EXCEPTION: Error in http://localhost:4200/app/app.component.js class AppComponent_Host - inline template:0:0
ORIGINAL EXCEPTION: No provider for AngularFire!
ORIGINAL STACKTRACE:
Error: DI Exception
at NoProviderError.BaseException [as constructor] (http://localhost:4200/vendor/@angular/core/src/facade/exceptions.js:27:23)
at NoProviderError.AbstractProviderError [as constructor] (http://localhost:4200/vendor/@angular/core/src/di/reflective_exceptions.js:43:16)
at new NoProviderError (http://localhost:4200/vendor/@angular/core/src/di/reflective_exceptions.js:80:16)
at ReflectiveInjector_._throwOrNull (http://localhost:4200/vendor/@angular/core/src/di/reflective_injector.js:786:19)
at ReflectiveInjector_._getByKeyDefault (http://localhost:4200/vendor/@angular/core/src/di/reflective_injector.js:814:25)
at ReflectiveInjector_._getByKey (http://localhost:4200/vendor/@angular/core/src/di/reflective_injector.js:777:25)
at ReflectiveInjector_.get (http://localhost:4200/vendor/@angular/core/src/di/reflective_injector.js:586:21)
at NgModuleInjector.get (http://localhost:4200/vendor/@angular/core/src/linker/ng_module_factory.js:98:52)
at DebugAppView._View_AppComponent_Host0.createInternal (AppComponent.ngfactory.js:16:70)
at DebugAppView.AppView.create (http://localhost:4200/vendor/@angular/core/src/linker/view.js:101:21)
ERROR CONTEXT:
[object Object] ; Zone: <root> ; Task: Promise.then ; Value: ViewWrappedException {_wrapperMessage: "Error in http://localhost:4200/app/app.component.js class AppComponent_Host - inline template:0:0", _originalException: NoProviderError, _originalStack: "Error: DI Exception↵ at NoProviderError.BaseExc…0/vendor/@angular/core/src/linker/view.js:101:21)", _context: DebugContext, _wrapperStack: "Error: Error in http://localhost:4200/app/app.comp…ndor/@angular/core/src/application_ref.js:353:27)"}consoleError @ zone.js:461_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426
zone.js:463 Error: Uncaught (in promise): EXCEPTION: Error in http://localhost:4200/app/app.component.js class AppComponent_Host - inline template:0:0(…)consoleError @ zone.js:463_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426
これは私のmain.tsです:
import { BrowserModule } from '@angular/platform-browser';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { bootstrap } from '@angular/platform-browser-dynamic';
import { enableProdMode, NgModule } from '@angular/core';
import { AppComponent, environment } from './app/';
import { AngularFireModule, FIREBASE_PROVIDERS, AuthProviders, AuthMethods } from 'angularfire2';
// Must export the config
export const firebaseConfig = {
apiKey: "",
authDomain: "",
databaseURL: "",
storageBucket: ""
};
export const firebaseAuthConfig = {
provider: AuthProviders.Password,
method: AuthMethods.Popup
}
@NgModule({
imports: [
BrowserModule,
AngularFireModule.initializeApp(firebaseConfig, firebaseAuthConfig)
],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})
export class MyAppModule {}
if (environment.production) {
enableProdMode();
}
bootstrap(AppComponent);
これは私の app.component.ts です:
import { Component, Inject } from '@angular/core';
import {AngularFire, FirebaseAuth, AuthProviders} from 'angularfire2';
@Component({
moduleId: module.id,
selector: 'app-root',
templateUrl: 'app.component.html',
styleUrls: ['app.component.css']
})
export class AppComponent {
title = 'Tour of Heroes';
hero = 'Windstorm';
//constructor (private _auth: FirebaseAuth) {}
constructor(public af: AngularFire) {
}
public doLogin () {
// This will perform popup auth with google oauth and the scope will be email
// Because those options were provided through bootstrap to DI, and we're overriding the provider.
/*this._auth.login({
provider: AuthProviders.Facebook
});*/
this.af.auth.login()
}
}
@Component({
selector: 'auth-status',
template: `
<div *ng-if="auth | async">You are logged in</div>
<div *ng-if="!(auth | async)">Please log in</div>
`
})
export class LoggedIn {
constructor (@Inject(FirebaseAuth) public auth: FirebaseAuth) {}
}