簡體   English   中英

我在角度2的shareService發送值正常工作,但是當我渲染我的其他組件時會獲得默認值

[英]my shareService in angular 2 send value work Properly but when i render my another components get default values

我正在嘗試創建一個angular 2.的應用程序angular 2.有一個Userservice,並且當用戶signIn或singOut Im將值發送到另一個組件,該組件表示用戶是否登錄並且其工作正常時,這意味着發送數據。 我的問題是我在另一個名為islogin且具有默認值(false)的組件中擁有私有屬性,我訂閱了我的userService islogin ...但是當我的呈現默認值的組件再次設置時。 如何解決這個問題? 這是我的代碼:

***********************userService*********************************

@Injectable()
export class UserService {

    private static _data: any;

    isLogin$:Subject<boolean> = new Subject();
    UserInfo$:Subject<any> = new Subject();

    // Observable streams
    CheckUser = this.isLogin$.asObservable();
    userinfo = this.UserInfo$.asObservable();

    constructor(private _util: UtilService) {


    }


    public signUp(data: any) {
        return this._util.post('api/auth/register', data);
    }

    public signIn(data: any) {
        var promise = this._util.post('api/auth/login', data);
        promise.then(value => {
            if (value.status == 0) {
                UserService._data = value.result;
                this.isLogin$.next(true);
                this.UserInfo$.next(UserService._data);
            }
        });
        return promise;
    }

    public signOut() {

        var promise = this._util.post('api/auth/logout');
        promise.then(value => {
            if (value.status == 0) {
                this.reset();
                this.isLogin$.next(false);
                this.UserInfo$.next(UserService._data);

            }
        });
        return promise;

    }
}

*********************someComponent like user profle********************

export class Profile extends Ext {

    private isLogin:boolean;
    private model ;


    constructor( 
                private _router: Router,
                private _routeParams: RouteParams, 
                private _seo: SEOService,
                private _user: UserService)
    {
        super();


        this._user.CheckUser.subscribe(val =>{

            this.isLogin = val;
            console.log(this.isLogin);
            alert(val);

        });

        this._user.userinfo.subscribe(val => {

            this.model = val;
            alert(val);

        });
}
}

這是此組件的模板:

<div *ngIf="isLogin | async" class="container">
   hiiiii {{model.name}}
</div>

我有什么問題?

問題是您在不是可觀察的對象(即isLogin )而是布爾屬性的對象上使用了async管道。

因此,您可以使用以下命令:

<div *ngIf="isLogin" class="container">
  hiiiii {{model.name}}
</div>

您可以像這樣更新組件:

export class Profile extends Ext {
  private isLogin:Observable<boolean>; // <-----
  private model ;

  constructor( 
            private _router: Router,
            private _routeParams: RouteParams, 
            private _seo: SEOService,
            private _user: UserService)
  {
    super();

    this.isLogin = this._user.CheckUser; // <-----

    (...)
  }
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM