Angular2，TypeScript，Ionic 2代碼執行順序

我在這裏有一個有趣的情況，我試圖瞭解哪些是編寫此代碼的最佳方式。Angular2，TypeScript，Ionic 2代碼執行順序

我有一個服務，我使用注入一個組件來從服務器獲取數據返回一個observable。下面是代碼：

getDataFromServer(): Observable<any> { 
    this.storage.get('access_token').then((access_token) => { 
     let headers = new Headers({ 'Content-Type': 'application/x-www-form-urlencoded', 'Authorization': 'Bearer ' + access_token }); 
     let options = new RequestOptions({ headers: headers }); 
    }); 

    return this.http.get(config.apiArticlesUrl, options) 
    .map(this.extractData) 
    .catch(this.handleError); 
}

所以你可以在這裏看到，預計該方法返回觀測。它還有一個在方法體內部執行的存儲方法，該方法返回一個承諾，其中包含使用承載令牌從服務器獲取數據所需的結果數據。

現在，Typescript抱怨說，在這種情況下，由於範圍問題，選項變量在此處未定義。如果我在.then（function）主體外部定義options變量，那麼所有時間選項變量將由於承諾執行而爲空，因此我可以向服務器進行身份驗證。

如果我把return this.http.get(config.apiArticlesUrl, options).map(this.extractData).catch(this.handleError);放在.then(function{})內部，那麼TypeScript會抱怨Observable需要從這個方法返回。

重要的是我使用'@ ionic/storage'中的import {Storage}; 無論何時使用.get方法，它總是返回一個Promise，這不是一個很好的練習來更改第三方核心代碼。

問題是：編寫這段代碼的最好方法是什麼，所以每當我訂閱Observable時，我都會得到用戶認證合併的Promise和Observable？

我希望我以正確的格式提出問題，以及是否可以分享一些鏈接，這些鏈接都以一種乾淨的方式進行解釋，這將非常有用。

乾杯。

來源

2017-04-09 Rambo

你不應該使用Observable和Promise，因爲兩者都是兩個端點。你可以在這個[**答案**]中看到最好的方法（http://stackoverflow.com/questions/43305876/set-global-data-to-property-from-get-request-before-continue/43307401# 43307401）如果您需要更多信息，請告知我 – Aravind

我剛剛更新了我的問題。我不認爲我能夠實施您剛剛與我分享的解決方案，因爲我無法在@ ionic/storage模塊中更改第三方代碼（存儲）。 – Rambo

您可以使用使用方式和通用方式處理服務 – Aravind

下面是我已經解決了這個問題。

我已經重新調整了服務的方法是這樣的：

getDataFromServer(): Promise<any> { 
     return this.storage.get('access_token').then((access_token) => { 
      let headers = new Headers({ 'Content-Type': 'application/x-www-form-urlencoded', 'Authorization': 'Bearer ' + access_token }); 
      let options = new RequestOptions({ headers: headers }); 

      return this.http.get(config.apiArticlesUrl, options); 
    }); 
    }

在哪裏，我想這要執行我用這個代碼的地方：

this.dataService.getDataFromServer().then(
    (data) => { 
    console.log("data:",data); 
    data.subscribe((data)=>{ 
     console.log("This is the data : ", data); 
    }, 
    (err) => console.log("err :",err) 
    ) 
    }, 
    (err)=>console.log("err",err) 
)

而且它的工作原理大。儘管如此，我仍然不能說評論的解決方案不是一個好的（更好的實施方式），但是由於我想分享這種類型的解決方案，有不同類型的情況。

來源

2017-04-09 22:07:13 Rambo

Angular2，TypeScript，Ionic 2代碼執行順序

回答

相關問題