2016-10-10 29 views
1

我正在編寫一個應用程序在angular2中,我想模擬後端,這只是沒有準備好在這一點上。Angular2如何模擬後端進行開發

這是我的服務:

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

import { Item } from './item'; 

@Injectable() 
export class ItemService { 

    private itemUrl = 'api/item'; // URL to web api 

    constructor(private http: Http) { } 

    getItems(): Observable<Item[]> { 
     return this.http 
      .get(this.itemUrl) 
      .map(this.extractData) 
      .catch(this.handleError); 
    } 

    addItem(name: string): Observable<Item> { 
     let body = JSON.stringify({ name }); 
     let headers = new Headers({ 'Content-Type': 'application/json' }); 
     let options = new RequestOptions({ headers: headers }); 

     return this.http.post(this.itemUrl, body, options) 
      .map(this.extractData) 
      .catch(this.handleError); 
    } 

    private extractData(res: Response) { 
     let body = res.json(); 
     return body.data || {}; 
    } 

    private handleError(error: any) { 
     let errMsg = 'error'; 
     return Observable.throw(errMsg); 
    } 
} 

而且我想攔截其被設置爲「itemUrl」在我的打字稿代碼每一個請求,讓平時名單上簡單的操作。

回答

1

您應該使用angular-in-memory-web-api。一個例子見this post。也檢查出the documentation。從長遠來看,使用這可能會比試圖使用Angular的MockBackend節省更多的時間。您可以使用內存中的web-api進行單元測試開發。

+0

角存儲器web-api是「實驗性的而不是用於生產用途」的事實呢? –

+1

@RuiMarques你爲什麼要用它來製作?它只是用於開發和演示。 –