Question

我的 app.component

import { Component, OnInit } from '@angular/core';
import { AngularFire } from 'angularfire2';
import { Subscription } from 'rxjs/Subscription';
import { MainService } from './main.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'
})
export class AppComponent implements OnInit {
    private logsub: Subscription;
    private checking: string;
    constructor(private af: AngularFire, private mainService: MainService){}

    ngOnInit(){
        this.logsub = this.mainService.userThere$.subscribe(isUser => {
            if (isUser){
                firebase.auth().onAuthStateChanged(function(user){
                    if (user){
                        this.mainService.userLogged(true);
                        alert("True");
                    }
                    else {
                        this.mainService.userLogged(false);
                    }
                });
            }
        });

        if (this.mainService.userLogged){alert("Fish");}
    }

    ngOnDestroy(){
        this.logsub.unsubscribe();
    }
}

我的 main.services

import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';

@Injectable()
export class MainService {
    private userThere = new Subject<boolean>();
    userThere$ = this.userThere.asObservable();

    userLogged(isUser: boolean){
        this.userThere.next(isUser);
    }
}

这里我不明白的是这个。我有一个用户授权码。如果有用户，我将返回alert("True")。我还将userLogged订阅设置为true。

当我加载页面时，我可以确认没有用户。我没有得到alert("True");。但是，在此之下我添加了一个测试代码if (this.mainService.userLogged){alert("Fish");}。

尽管没有用户，我仍然被警告Fish。

Answer 1

正在alert块中调用if，您正在检查服务userLogged上是否存在方法mainService

if (this.mainService.userLogged){alert("Fish");}

当mainService被注入到组件中（即，通过角度注入器实例化并传递到组件的构造函数中）时，它将具有您在其中定义的所有方法。 typescript类最终是 javascript构造函数，在实例化时会为您提供 javascript对象。这些对象可以具有作为属性的函数，您可能知道这些属性是JS中的第一类对象。

因此，当您检查this.mainService.userLogged时，if块中会出现 truthy 值，因为userLogged中定义了mainService。因此，它进入if区块并且alert被解雇。

编辑：

根据评论我收集的内容是，当用户信息通过mainService.userThere$观察者流到达时，您希望能够编写其他逻辑。我们可以为单个观察者流提供多个回调。也就是说，在观察者源被触发时，将调用您在观察者流中注册的所有回调。所以你可以这样做：

ngOnInit(){
    this.logsub = this.mainService.userThere$.subscribe(isUser => {
        if (isUser){
            firebase.auth().onAuthStateChanged(function(user){
                if (user){
                    //this.mainService.userLogged(true);
                    alert("True");
                    // no need to set userLogged true or false again 
                }
                else {
                    //this.mainService.userLogged(false);
                }
            });
        }
    });

//if (this.mainService.userLogged){alert("Fish");}
// instead of above do this
this.mainService.userThere$.subscribe( isUser => {
    alert("Fish");
    // We can attach as many functions as we want to the
    // observer stream. So all you have to do is simply pass
    // userThere$ observer stream in any component you want to
    // write the additional logic
})



 }

希望这有帮助

我订阅的Angular 2问题

1 个答案: