This project was generated with Angular CLI version 8.3.19.
-
Run
ng serve
for a dev server. Navigate tohttp://localhost:4200/
. The app will automatically reload if you change any of the source files. -
Run
json-server -w db.json
for a db json db server. api server Navigate tohttp://localhost:3000/
.
- 請製作一個含有編輯功能的
dialog
元件- 如果找不到
@angular/material
模組,您可以嘗試使用以下指令安裝模組套件到專案中npm install --save @angular/material
- 安裝
material
模組另外還必須要安裝其相依套件@angular/cdk
- 安裝完成後記得要到
app.module.ts
當中引用模組MatDialogModule
MatInputModule
MatButtonModule
- 並且在
providers
內加入以下設定{ provide: MatDialogRef, useValue: {} },
{ provide: MAT_DIALOG_DATA, useValue: {} }
- 如果找不到
dialog
元件中,要有三個編輯的欄位,分別為 [姓名、身高、體重]- 並且不要讓
dialog
元件能夠直接更改外部傳來的物件。 - 另外,在此
dialog
的下方會有三個按鈕,[確定、重置、取消]- 執行過程中可能會有此錯誤
-
Found the synthetic property @panelState. Please include either "BrowserAnimationsModule" or "NoopAnimationsModule" in your application.
-
- 可以使用以下指令補上套件參考
npm install --save @angular/animations
- 安裝完成後記得要到
app.module.ts
當中引用模組BrowserAnimationsModule
- 執行過程中可能會有此錯誤
- 當在
dialog
上按下確定按鈕後,發出post request
更新本地的db
- 在更新資料成功後,關閉
dialog
,如果更新資料沒有成功,請出現alert
提示使用者。 - 若使用者按下取消按鈕,直接將
dialog
關閉。 - 若使用者按下重置按鈕,請將
dialog
內的資料重置。