Global Variable and how pass the value in IONIC3

Question

I think my problem is very simple, but i'm certainly sothing passing me.

I need to put a TOKEN for the HTTP resquests in a global variable after login. In my Login page, the HTTP get, return an object with: HTTP code (200,403,403), a Message("Success") and the TOKEN, and i pass this object to the HOME.ts page true the NavController.

this.navCtrl.setRoot(HomePage,{
    data   <<--- Object                        
  });

But when i try to put this return "data" in a object of the type "Login"

export class Login {

code:number;
token:string;
message:string;

constructor(code?:number, token?:string, message?:string){
    this.code = code;
    this.token = token;
    this.message = message;

}

}

To put the atribute Login.token inside the global variable, nothing happen.

I made some test and this is what i have until know.

In the HOME.ts i put some console.log, to figure it out what happen.

 console.log(this.navParams.data.data); ----> RESULT 1

console.log(this.navParams.get("data"));    ----> RESULT 2

this.dadosRest = this.navParams.get("data");

console.log(this.dadosRest);  ----> RESULT 3

console.log(this.dadosRest.token); -----> RESULT 4

RESULT 1 and 2 and 3:

{success: {…}}

success : code : 200 message : "Welcome admin - This is your token (generated by a previous call)" token : "676f71bab54dad7589c3d1b6b5f5b24de0f8c484" proto : Object proto : Object

RESULT 3 :

undefined

Why i can't put this return inside the object Login to manage?

Answer 1

Do not use globals. You can use either a shared service (create a service that you inject in the components, and them you use a method to store there your token and another one to read the stored value) or store it in some kind of storage (like the Ionic Storage ) or even (and more complicated) use some state container, like Redux.

Anyway: don't pollute the global scope. Maybe you could do this using something like

window.token = 'the token'

but this is not a good ideia.