CODEWITHSUNDEEP
typescriptionic2
pittuzzo
pittuzzo

Reputation: 491

Ionic2: handle a provider

While developing a ionic2 project, I created a new provider but I have some difficulties in setting variables in MyClass.

import { Injectable } from '@angular/core';
import { Http, Headers } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class MyClass {
    token_acces: any;
    token_room: any;

    constructor(private http: Http) {
        this.token_acces = null;
        this.token_room = null;
    }

    login(id,pwd){
        let headers = new Headers();
        headers.append('Content-Type', 'application/json');
        this.http.post('/localhost/',
                        JSON.stringify({
                            username: id ,
                            password: pwd
                        }), {headers : headers})
                    .map(res => res.json())
                    .subscribe(data=>{
                        this.token_acces = data;
                    });
    }

    getToken(){
        return this.token_acces;
    }

}

The main issue is that the login() doesn't set the token_access which is null when I call the getToken().

Moreover I have a doubt, this provider is used by all the pages in my app. For example the homepage contains:

...
export class HomePage {
    id: any;
    pwd: any;

    constructor(public navCtrl: NavController, public myClassService: MyClass) { }

    login(): void{
        this.myClassService.login(this.id, this.pwd);
        this.navCtrl.push(SearchPage, { token : this.myClassService.getToken()});
    }
}

If I do the same with another page, for example:

export class SearchPage {
    token: any;

    constructor(public navCtrl: NavController, public myClassService: MyClass) { }
...

Am I using the same instance or it is a different istance of MyClass and so I can't get the values set in the previous page?

Upvotes: 1

Views: 75

Answers (1)

Sagar Kulkarni
Sagar Kulkarni

Reputation: 2081

In MyClass of your code:

login(id,pwd){
    let headers = new Headers();
    headers.append('Content-Type', 'application/json');
    return Observable.create(observer => {
        this.http.post('/localhost/', JSON.stringify({
                        username: id ,
                        password: pwd
                    }), {headers : headers})
        .map(res => res.json())
        .subscribe(data => {
            this.token_acces = data;
            observer.next(data);
        },(err) => {
            console.log("Error occurred: ", err);
            observer.error(err);
        });
    });
}

In HomePage class or any other calling class/method of code:

login(): void{
    this.myClassService.login(this.id, this.pwd).subscribe((data) => {
        this.navCtrl.push(SearchPage, { token : this.myClassService.getToken()});
    },
    (err) => {
        console.log("Error occurred : ", err);
    });
}

You do not even need to use getToken(). You can just use data in subscribe() which will give you necessary data about token.

Upvotes: 2

Related Questions