Angular4：如何訪問本地json？

Question

在Angular2你可以有一個文件夾/數據/和JSON文件那裏，你可以在本地主機訪問它：4200 /數據/ something.json。

這是Angular4不再可能。

任何IDEEA如何得到它的工作？

Answer 1

您可以使用此代碼

@Injectable() 
export class AppServices{ 

    constructor(private http: Http) { 
     var obj; 
     this.getJSON().subscribe(data => obj=data, error => console.log(error)); 
    } 

    public getJSON(): Observable<any> { 
     return this.http.get("./file.json") 
         .map((res:any) => res.json()) 
         .catch((error:any) => console.log(error)); 

    } 
} 

這裏file.json是您的本地JSON文件。

看到這裏也

• How to get a json file in angular2 using the Http class

也看到了角的CLI路徑

• https://github.com/angular/angular-cli/blob/master/CHANGELOG.md#100-rc4-2017-03-20

Answer 2

我計算出來的changlog。

在Angular2我有src文件夾下的文件夾。 在Angular4中，你必須在根文件夾中。

實施例：

Angular2：

根/ SRC /數據/ file.json

Angular4：

根/數據/ file.json

Answer 3

當然有可能。讓我們假設這是你的JSON文件

這裏是你的代碼來調用JSON

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

@Injectable() 
export class YourService { 

    constructor(private http: Http) { } 

    getAdvantageData(){ 
     let apiUrl = './assets/data/api/advantage.json'; 
     return this.http.get(apiUrl) 
     .map((response: Response) => { 
     const data = response.json(); 
     return data; 
     }); 
    } 
} 

Answer 4

我面臨同樣的問題，我的可觀察角度的服務是位於內'src/app /'文件夾，它試圖加載本地JSON文件。我試圖把JSON文件相同的應用程序文件夾內，一個新的「API」文件夾內，使用各種親戚/絕對的路線，但它並沒有幫助，我得到404錯誤。當我把它放在'資產'文件夾裏的那一刻...... BAM！有效。我想有更多的吧...

可能是這個鏈接可以幫助...

COMPONENT-RELATIVE PATHS IN ANGULAR

Answer 5

您可以使用「要求」太多;

let test = require('./test.json');