Ionic2：處理供應商

在開發ionic2項目時，我創建了一個新的供應商，但在MyClass中設置變量時遇到一些困難。Ionic2：處理供應商

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這是null當我打電話的getToken()。

此外，我有一個疑問，這個供應商被我的應用程序中的所有頁面使用。例如網頁包含：

... 
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不同istance等我無法獲取上一頁中設置的值？

來源

2017-02-10 pittuzzo

如果提供程序在'ngModule'中聲明，則您將擁有相同的實例。至於沒有收到令牌，http調用是異步的，它可能還沒有設置值。 –

在按鈕按下時，我在提供程序中執行http.post，在新頁面加載後，它從提供程序獲取值，但它仍未設置。我如何等待http.post完成他的處理？ – pittuzzo

在提供程序中的http post上創建一個Observable。將該Observable返回到調用類/方法。在調用類中訂閱此Observable。現在，在調用類中，在'subscribe（）'中做任何你需要做的事情。看看http://stackoverflow.com/questions/42160061/ionic-2-login-component-and-auth-service –

在你的代碼中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); 
     }); 
    }); 
}

在HomePage類或其他代碼調用的類/方法：

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，這將爲您提供有關令牌的必要數據。

來源

2017-02-11 11:43:15

非常感謝，它確實工作。是否有可能設置超時？ – pittuzzo

是的。一般來說，你可以在任何地方設置超時時間，例如'setTimeout（（）=> console.log（「3秒後完成」）; }，3000）;'。你如何使用它取決於你。 –

Ionic2：處理供應商

回答

相關問題