Ionic2:处理提供程序

Question

在开发ionic2项目时，我创建了一个新的提供程序，但是在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;
    }
}

主要问题是login()没有设置token_access，当我调用getToken()时，null。

此外，我有一个疑问，我的应用程序中的所有页面都使用此提供程序。例如，主页包含：

...
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()});
    }
}

如果我对另一个页面做同样的事情，例如：

export class SearchPage {
    token: any;
    constructor(public navCtrl: NavController, public myClassService: MyClass) { }
...

我使用的是相同的实例还是MyClass的不同状态，因此无法获得上一页中设置的值？

Answer 1

在代码的 MyClass 中：

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);
        });
    });
}

在主页类或任何其他调用类/代码方法中：

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);
    });
}

您甚至不需要使用 getToken() .您可以在subscribe()中使用data，这将为您提供有关令牌的必要数据。