在本地項目文件夾中加載JSON時使用angular 2 http離線

我一直在嘗試使用http get方法加載Angular 2的項目文件夾中存在的本地json文件。看下面的示例代碼片段：在本地項目文件夾中加載JSON時使用angular 2 http離線

private _productURL = 'api/products/products.json';  
getProducts(): Observable<any> { 
     return this._http.get(this._productURL).map((response : Response) => <IProduct[]> response.json()) 
     .do(data =>console.log(JSON.stringify(data))).catch(this.handleError); 
    }

現在，當我試圖加載與互聯網連接，它的工作。但是當我從瀏覽器開發人員選項（https://developers.google.com/web/tools/chrome-devtools/network-performance/reference#offline）中脫機複選框時，json停止再次加載。它開始顯示我在控制檯中有關沒有互聯網連接的錯誤，不加載任何東西。

有沒有其他方法可以做到這一點？或使用http get..how來做到這一點？

來源

2017-04-11 Kush Grover

你想從一個JSON VAR加載它，如果沒有連接，或者你要存儲一個副本，一旦你有一個連接並加載它，如果沒有連接？ –

我有一個長的json數組存儲在不會改變的分離文件中..i.e。它會靜態..所以它會作爲我的項目 –

的一部分，所以爲什麼使用http加載它？ –

如果你這樣做你可以導入json文件，如下所示：

創建一個JSON-typings.d.ts文件：

declare module "*.json" { 
    const value: any; 
    export default value; 
}

這是一個wildcard module definition，使我們能夠導入非JavaScript的這種情況下的文件是JSON文件。

你現在應該能夠JSON文件導入到項目中：

import * as products from "./products.json";

來源

2017-04-12 09:22:54

謝謝..它的工作！後來我也嘗試使用node.js require（'./ products.json'）方法將其導入到變量中，然後使用它。此方法是否正確？ –

這也很好，只是沒有使用打字稿/ es6 –

好的..非常感謝您的幫助:) –

在本地項目文件夾中加載JSON時使用angular 2 http離線

回答

相關問題