Überprüfung Authentifizierungsstatus mit AngularFire2 v4

Question

Ich versuche AngularFire2 v4 Authentifizierung Zustand auf einer Service-Klasse zu kapseln, damit ich einen einzigen Weg zu überprüfen, ob der Benutzer authentifiziert ist.

Ich verfolge die v4 Upgrade-Anleitung unter: https://github.com/angular/angularfire2/blob/master/docs/version-4-upgrade.md

Hier ist der relevante Teil meiner Dienstklasse:

export class AuthService { 

    user: Observable<firebase.User>; 

    constructor(
    private angularFireAuth: AngularFireAuth, 
) { 
    this.user = this.angularFireAuth.authState; 
    } 

    get isAuthenticated(): boolean { 
    let authenticated = false; 
    this.user.take(1).subscribe(user => authenticated = user !== null); 
    return authenticated; 
    } 

} 

Das Problem, das ich habe, ist, dass authenticated immer false zurückkehrt, auch wenn user nicht null ist. Was mache ich falsch?

Answer 1

Es wird false zurückgegeben, da der Callback innerhalb von subscribe synchron aufgerufen wird, wenn Werte in der Observablen oder asynchron gelesen werden, wenn noch keine Werte zu lesen sind. In Ihrem Fall gibt es keine, so dass Sie tatsächlich die ursprüngliche false zurückgeben, ohne auf diese Werte zu warten.

Man könnte so etwas tun:

get isAuthenticated(): Observable<boolean> { 
    return this.user.last().map(user => user !== null); 
} 

, jetzt, wo Getter in Ihrer Vorlage zu verwenden, sollten Sie die async Rohr verwenden. Etwas wie: *ngIf="(isAuthenticated | async)".

Hinweis Ich habe auch die .take(1) für .last() geändert, die ich denke, macht hier mehr Sinn.

genau zu zeigen, was hier geschieht.

Beobachtbarkeit synchron genannt:

const source = Rx.Observable.range(0, 2); 
 

 
function isAuthenticated() { 
 
    let authenticated = false; 
 
    
 
    source.last().subscribe((x) => { 
 
    console.log('New value: ' + x); 
 
     
 
    authenticated = true; 
 
    }); 
 
    
 
    return authenticated; 
 
} 
 

 
console.log(isAuthenticated()) 
 
console.log(isAuthenticated())

<script src="http://cdnjs.cloudflare.com/ajax/libs/rxjs/5.4.0/Rx.js"></script>

Observable asynchron aufgerufen wird:

const source = Rx.Observable.range(0, 2).delay(1000); 
 

 
function isAuthenticated() { 
 
    let authenticated = false; 
 
    
 
    source.last().subscribe((x) => { 
 
    console.log('New value: ' + x); 
 
     
 
    authenticated = true; 
 
    }); 
 
    
 
    return authenticated; 
 
} 
 

 
console.log(isAuthenticated()) 
 
console.log(isAuthenticated())

<script src="http://cdnjs.cloudflare.com/ajax/libs/rxjs/5.4.0/Rx.js"></script>