2017-05-29 3 views
0

Ich versuche zur Zeit zu folgen: https://github.com/angular/angularfire2Firebase & AngularFire2 ‚afAuth‘ existiert nicht auf Typ ‚Appcomponent‘

ich ein Problem von immer bin: Property ‚afAuth‘ existiert nicht auf Typ ‚AppComponent‘ .

sieht mein app.component.ts wie folgt aus:

import { Component } from '@angular/core'; 
import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database'; 
import { AngularFireAuth } from 'angularfire2/auth'; 
import { Observable } from "rxjs/Observable"; 
import * as firebase from 'firebase/app'; 


@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent { 
    user: Observable<firebase.User>; 
    items: FirebaseListObservable<any[]>; 
    constructor(afAuth: AngularFireAuth, db: AngularFireDatabase) { 
    this.user = afAuth.authState; 
    this.items = db.list('items'); 
    } 
    login() { 
    this.afAuth.auth.signInWithPopup(new firebase.auth.GoogleAuthProvider()); 
    } 
    logout() { 
    this.afAuth.auth.signOut(); 
    } 
} 

Und mein app.module.ts sieht wie folgt aus:

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import { AngularFireModule } from 'angularfire2'; 
import { AngularFireDatabaseModule } from 'angularfire2/database'; 
import { AngularFireAuthModule } from 'angularfire2/auth'; 
import { AppComponent } from './app.component'; 
import { environment } from '../environments/environment'; 

export const firebaseConfig = { 
    apiKey: 'xxxxxxxxxxxxxxxxxxxx', 
    authDomain: 'xxxxxxxxxxxxx', 
    databaseURL: 'xxxxxxxxxxxxxxxxxx', 
    projectId: 'xxxxxxxxxxxxxxxxx', 
    storageBucket: 'xxxxxxxxxxxxxxx', 
    messagingSenderId: 'xxxxxxxxxx' 
}; 

@NgModule({ 
    declarations: [ 
    AppComponent 
    ], 
    exports: [ AppComponent ], 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    AngularFireModule.initializeApp(firebaseConfig), 
    AngularFireDatabaseModule, 
    AngularFireAuthModule 
    ], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

Wer weiß, wie ich über die Festsetzung dieses Problem gehen würde? (Ich bin extrem neu in der Programmierung - nur wollen Daten in Firebase werfen, aber keine Tutorials scheint mir eine aktuelle Möglichkeit, darüber zu zeigen, wie dies zu tun)

Antwort

1

Es ist ein Typoskript Problem. Sie haben afAuth weder privat noch öffentlich festgelegt, so dass Sie nur innerhalb des Bausteins darauf zugreifen können. Ändern Sie es wie folgt:

... 
export class AppComponent { 

    ... 

    constructor(private afAuth: AngularFireAuth, db: AngularFireDatabase) { 
    this.user = afAuth.authState; 
    this.items = db.list('items'); 
    } 

    ... 

} 
+0

Vielen Dank.Das war genau das Problem. Ich habe privat vor afAuth in meinem Konstruktor hinzugefügt und das Problem wurde behoben. –

Verwandte Themen