, wie man Feuerbasis Login Veranstaltungen mit angularfire2

Question

Ich sah dieses Beispiel dafür, wie zu abonnieren, um Feuerbasis Auth Ereignisse

this.firebase.onAuth((user) => {}) 

Wie kann ich das gleiche tun mit angularfire2 und ionic2 und angular2 Projekt abonnieren?

constructor(nav:NavController, private auth: FirebaseAuth) { 
    auth.onAuth ... // I don't see any subscription events on the firbaseAuth object 
} 

sah ich diese Syntax in der angularfire2 Dokumentation aber nicht sicher, was die | Syntax bedeutet und wie die gleiche Logik aus dem @Component declartion in dem Controller-Code zu tun:

import {FirebaseAuth} from 'angularfire2'; 
@Component({ 
    selector: 'auth-status', 
    template: ` 
    <div *ng-if="auth | async">You are logged in</div> 
    <div *ng-if="!(auth | async)">Please log in</div> 
    ` 
}) 
class App { 
    constructor (@Inject(FirebaseAuth) public auth: FirebaseAuth) {} 
} 

Answer 1

I don‘ Ich weiß über Iconic, aber mit angularafire2 (2.0.0-beta.2). Hier ist, wie dies zu tun ist. Vorausgesetzt, das Projekt wurde so eingerichtet, dass AngularFire ein injizierbarer Dienst ist. (Ich folgte die Anweisungen auf Angularfire2 Github.)

@Component({ 
    .. blah, blah, blah 
}) 
export class MyComponent{ 

    constructor(private AngularFire af){ 
    af.subscribe.auth(auth => { 
     //the auth object contains the logged in user info 
     // if one exists. 
     console.log(auth) 
    }); 
} 

Um das Auth-Objekt aus der HTML-Vorlage (wie in Ihrem Beispiel) zu beziehen, speichere nur das Objekt Auth vom Aufruf zurück als Membervariable abonnieren. Ihr Vorlagencode überprüft gerade nicht-null, um festzustellen, dass ein angemeldeter Benutzer vorhanden ist.

Answer 2

Dies hat in "angularfire2": "^4.0.0-rc.1"

aktualisiert die SUBSCRIBE wird jetzt in authState vom import { AngularFireAuth } from 'angularfire2/auth';

Also in Ihrem ngModule Sie brauchen

import { AngularFireAuthModule } from 'angularfire2/auth'; 

hinzuzufügen und es zu Ihren Importen hinzufügen und dann in Ihrem app.components.ts

this.af.authState.subscribe(auth => { 
    console.log(auth); 
});