angular - How long does an Angular2 service hold the class variable values -


i'm have angular2 app dataservice should display different content based on logged in user. my issue authentication service doesn't store data value after first constructed making me unable access user id in other data providers.

here's have done accomplish 2 services, 1 component , 1 authguard (see below). logic expect is:

  1. authguard called before inbox route activated
  2. authguard calls authservice subscribes firebaseauth , sets authstate variable
  3. at times if user logged in, dataservice should have value authservice.id authservice

however, happens authservice.id yields 'not set' appears never set though user logged in. can proved adding console.log(state) after subscribing auth$ in authservice prints logged in user.

my question therefore how long variable private authstate stored in authservice? there other solution obtaining observable value of authservice.id variable before making other calls in dataservice? 1 solution can think of using switchmap in dataservice each data call seems suboptimal.

authservice

@injectable() export class authservice {    private authstate: firebaseauthstate = null;    constructor(private af: angularfire, public auth$: firebaseauth) {     auth$.subscribe((state: firebaseauthstate) => {       this.authstate = state;     });   }    authenticated() {     return this.authstate !== null;   }    id(): string {     return this.authenticated ? this.authstate.uid : 'not set';   } } 

authguard

@injectable() export class authguard implements canactivate {   constructor(private authservice: authservice, private router: router) {}    canactivate(): observable<boolean> {     return this.authservice.auth$       .take(1)       .map(authstate => !!authstate)       .do(authenticated => {         if (!authenticated) {           this.router.navigate(['/compose']);         }       });   }  } 

data service

@injectable() export class emailservice {    private emails: firebaselistobservable<iemail[]>;   private emailuserpath: string;    constructor(private af: angularfire, authservice: authservice) {     this.emailuserpath = `/emails/${authservice.id}`;   }    getallemails(): firebaselistobservable<iemail[]> {     return this.af.database.list(this.emailuserpath);   } } 

route module

const routes: routes = [   { path: 'inbox',  component: inboxcomponent, canactivate: [authguard] } ];  @ngmodule({   imports: [ routermodule.forchild(routes) ],   providers: [authguard],   exports: [ routermodule ] })  export class emailroutingmodule {} 

app module

import { browsermodule } '@angular/platform-browser'; import { ngmodule } '@angular/core'; import { formsmodule } '@angular/forms'; import { httpmodule } '@angular/http';  import { appcomponent } './app.component'; import { emailsmodule } './emails/emails.module';  import { approutingmodule }     './app-routing.module'; import { angularfiremodule, authproviders, authmethods } 'angularfire2'; import { usersearchcomponent } './shared/user-search/user-search.component'; import {authservice} "./auth/auth.service"; import {authguard} "./auth/auth-guard"; import {emailroutingmodule} "./emails/email-routing.module"; import { userorlogincomponent } './navigation/user-or-login/user-or-login.component'; import { navigationlistcomponent } './navigation/navigation-list/navigation-list.component';  export const firebaseconfig = {   apikey: "hidden",   authdomain: "hidden",   databaseurl: "hidden",   storagebucket: "hidden" };  const myfirebaseauthconfig = {   provider: authproviders.google,   method: authmethods.popup };  @ngmodule({   declarations: [     appcomponent,     usersearchcomponent,     userorlogincomponent,     navigationlistcomponent   ],   imports: [     browsermodule,     formsmodule,     httpmodule,     approutingmodule,     emailroutingmodule,     angularfiremodule.initializeapp(firebaseconfig, myfirebaseauthconfig),     emailsmodule // include emails module below here   ],   providers: [     authservice,     authguard   ],   bootstrap: [appcomponent] }) export class appmodule { } 

email app module

import { ngmodule } '@angular/core'; import { commonmodule } '@angular/common'; import { composecomponent } './compose/compose.component'; import { emaildetailcomponent } './email-detail/email-detail.component'; import { inboxcomponent } './inbox/inbox.component'; import { replycomponent } './reply/reply.component'; import { replylistcomponent } './reply/reply-list/reply-list.component'; import { emailservice } './shared/email.service';  import { formsmodule } '@angular/forms'; import {replyservice} "./reply/reply.service";  @ngmodule({   imports: [     commonmodule,     formsmodule   ],   declarations: [     composecomponent,     emaildetailcomponent,     inboxcomponent,     replycomponent,     replylistcomponent   ],   providers: [     emailservice,     replyservice   ] })  export class emailsmodule { }  export { emailservice }; 

they store values long live. when navigate somewhere outside of module sets value on service, lose value. because no longer have access instance has value set.

services singleton per provider. means if need service/value globally, need make singleton @ global level. providing authservice @ appmodule should solve problem.

import { authservice } 'path/to/service'  @ngmodule({   imports: [ ],   providers: [authservice], //<-- provided globally   exports: [ ] })  export class appmodule {} 

Comments

Popular posts from this blog

java - SSE Emitter : Manage timeouts and complete() -

jquery - uncaught exception: DataTables Editor - remote hosting of code not allowed -

java - How to resolve error - package com.squareup.okhttp3 doesn't exist? -