在之前的章節中,有提到要先介紹如何呼叫web API之前,我們可以先透過Angular的模擬資料伺服器機制,來測試HttpClient程式是否正確。
而Angular有提供一個模擬資料伺服器機制,讓我們用陣列物件的方式,來設定資料表的物件,來做查詢、列表、新增、更新、刪除等功能。而這個機制,在Angular,稱為「記憶體Web API(In-memory Web API)」來模擬出的遠端資料伺服器通訊。
安裝完成此模組之後,程式就可以透過HttpClient來發起請求和接收資料,就像是在操作資料庫一樣。而不用先要安裝資料庫的Server。
首先,先來啟用HTTP服務,HttpClient是Angular透過HTTP與遠端伺服器通訊的機制,在app.module.ts來import此模組 HttpClientModule,再加入到@NgModule.imports 陣列中,程式碼如下:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { FormsModule } from '@angular/forms';
import { EmployeeListComponent } from './employee-list/employee-list.component';
import { EmployeeDetailComponent } from './employee-detail/employee-detail.component';
import { EmployeeSalesListComponent } from './employee-sales-list/employee-sales-list.component';
@NgModule({
declarations: [
AppComponent,
EmployeeListComponent,
EmployeeDetailComponent,
EmployeeSalesListComponent
],
imports: [
BrowserModule,
FormsModule,
AppRoutingModule,
HttpClientModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
下回,就正式來安裝記憶體Web API(In-memory Web API)。