2017-07-06 55 views
1

我正在角2創建應用程序。我試圖通過服務中的http訪問json數據。但我得到一個錯誤說,角2:從HTTP訪問JSON時出錯

**GET http://localhost:4200/data/products.json 404 (Not Found)** 

我有指定文件夾中的數據,但我無法訪問它。

我的服務代碼如下。

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

@Injectable() 
export class ItemService { 
observableItems: Observable<Item[]> 
allItems: Item[] = []; 
selectedItems: Item[] = []; 
errorMessage: string; 
url = "http://localhost:4200/data/products.json"; 
constructor(private http:Http) { 
    this.observableItems = this.http.get(this.url).map((res: Response) => res.json()); 
    this.observableItems.subscribe(
      data => this.allItems = data, 
     error => this.errorMessage = <any>error); 
} 
getItems(): Observable<Item[]> { 
    return this.observableItems; 
} 
getSelectedItems(): Item[] { 
    return this.selectedItems; 
} 
    addItem(id:number): void { 
     let item = this.allItems.find(ob => ob.id === id); 
     if (this.selectedItems.indexOf(item) < 0) {  
     this.selectedItems.push(item); 
    } 
    } 
    removeItem(id:number): void { 
    let item = this.selectedItems.find(ob => ob.id === id); 
    let itemIndex = this.selectedItems.indexOf(item); 
     this.selectedItems.splice(itemIndex, 1); 
    } 
} 

enter image description here

+0

你可能想訪問JSON格式提供數據服務的端點。地址'http:// localhost:4200/data/products.json'表明有一個'product.json'文件可供下載。您更可能查詢「http:// localhost:4200/data/products」。 – dzejdzej

回答

2

我的HTML文件在

"Project/src/app/..." 

因此訪問JSON文件,我需要來自標籤腰夾和app文件夾,以達到代碼和圖像的基本目錄。我用../從文件夾中回來。

從此我的服務URL將如下:

url = "../../assets/data/products.json"; 
0

嘗試使用從你的服務文件的位置的文件直接路徑。例如:

url = "data/products.json"; 

它會工作。

+0

我嘗試過使用這種方式,但這不起作用。 –

+0

你能告訴我你的文件與服務相關的路徑嗎?它應該工作。 –

+0

我試圖改變文件的路徑到src ..路徑是url =「./ assets/data/data.json」 –