Angular set Global variable

Question

I'm trying to set my Global variable to a different value based on a string when I open my application.

globals.ts

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

@Injectable()
export class Globals {
  env: string;
  constructor() {}
  setEnv(setEnv: string) {
    this.env = setEnv;
  }
}

cti-nav.component.ts

import {Component, Inject, OnInit} from '@angular/core';
import {ListService} from '../../assets/list/list.service';
import {Globals} from '../globals';

export class CtiNavComponent implements OnInit {
    tools = this._ListService.getList(this.globals.env);  //<= returns undefined
    ngOnInit() {
        this.globals.setEnv('int');
        console.log(this.globals.env);  //<= returns int
    }
    constructor(private _ListService: ListService, private globals: Globals) {}
}

cti-nav.module.ts

import {Globals} from '../globals';

@NgModule({
    providers: [Globals]
})
export class CtiNavModule {}

list.service.ts

import {Injectable} from '@angular/core';
import {HttpClient} from '@angular/common/http';

@Injectable()
export class ListService {
  constructor(private http: HttpClient) {}

  getList(env) {
    return this.http.get('https://list.url.com/' + env);
  }
}

When I check the log it outputs int correctly and then in the _ListService part, it returns undefined. Correct would be if _ListService also returns int.

Now I don't understand what returns undefined exactly. The call to _ListService.getList(), or is it _ListService that is undefined (thus throwing an error at runtime, not returning anything) ? — Pac0
– Pac0, Commented Jan 31, 2019 at 10:41
Thank you, much clearer now. Indeed Mohan's answer's right, it was a problem of order of operations. — Pac0
– Pac0, Commented Jan 31, 2019 at 12:46

Mohan J Poola · Accepted Answer · 2019-01-31 10:42:17Z

4

ngOnInit will get called after the constructor and the properties like tools are initialized. You will have to rework the logic to initialize tools after initializing the Globals. May be you can try by calling setEnv in the constructor instead of ngOnInit

answered Jan 31, 2019 at 10:42

Mohan J Poola

1465 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Mohan J Poola Over a year ago

Good to know it worked for you! Can you accept this as an answer?

Tobe Over a year ago

I did, had to wait 5 minutes.

Anton Skybun · Accepted Answer · 2019-01-31 10:38:32Z

2

Trty to move your this._ListService.getList(this.globals.env); into constructor or ngOnInit

  import {Component, Inject, OnInit} from '@angular/core';
    import {ListService} from '../../assets/list/list.service';
    import {Globals} from '../globals';

        export class CtiNavComponent implements OnInit {
            tools; 
            ngOnInit() {
                this.globals.setEnv('int');
                console.log(this.globals.env);  //<= returns int
            }
            constructor(private _ListService: ListService, private globals: Globals) {
            this._ListService.getList(this.globals.env);  //try to move here
        }
        }

answered Jan 31, 2019 at 10:38

Anton Skybun

1,6591 gold badge11 silver badges22 bronze badges

3 Comments

Leo Over a year ago

The constructor is called before ngOnInit I believe, so this would produce the same result. I think getList should be called inside ngOnInit after the setEnv call.

Anton Skybun Over a year ago

try to move it to ngOnInit and say me what you get

Tobe Over a year ago

@AntonSkybun had to move getList into ngOnInit, but it didn't work without MOHAN's solution. Thanks!

Collectives™ on Stack Overflow

Angular set Global variable

2 Answers 2

2 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related