source code 在此
1. 首先修正 module/dbEmployees.js,增加一些員工資料
然後先手動新增一個 admin 帳號,可以把上次創的 admin 先刪掉,因為資料欄位不同了
方法和之前一樣,只要將 Schema 修改和 dbEmployee.js 一樣就好
First, modify module/dbEmployees.js as below to add more employee's data.
You can also create an admin account manually based on this schema.
2. 修正 public/views/nav.ejs,增加管理的功能,並且根據權限顯示不同選項
Modify public/views/nav.ejs to add more options in navigation bar.
Modify routes/route.js. Add a function to query all employees' data.
因為現在在render ejs 檔案時,需要是否為 admin 的資料
所以將相關資料送入,並增加 /adminManage 的 routing rule
EJS need to know use is admin or not when render pages. So give the relative
parameter in.
And add a new routing rule to handle adminManage.
增加三個 api : /api/addEmployee、/api/updateEmployee、/api/deleteEmployee
Add three more APIs.
/api/addEmployee : 增加一筆員工資料。Add data of one employee.
/api/updateEmployee : 更新某員工的資料。Update data of one employee
/api/deleteEmployee : 刪除一筆員工資料。Delete data of one employee
4. 增加 adminManage.ejs 到 public/views,詳細 code 直接看原始碼
這次是採用 SPA 的方式來寫,透過 ng-show 和 ng-hide 來達到不同頁面的效果
然後特別說一下使用 ng-repeat 時增加 performance 的方式
Add adminManage.ejs file to public/views. Won't explain details here, just take a
look at the source code. I used SPA concept to design adminManage.ejs.
可以看到這邊用了 " track by item._id",功用主要是讓 angular 可以不用再重新產生DOM
更詳細的說明可以參考這兩篇 : 資料1、資料2
There is some tips to improve performance when using ng-repeat. Check the ref.
5. 新增 adminManage.js 到 public/javascript,這邊沒有太複雜的部分,看 code 應該就會懂
Add adminMange.js to public/javascript. The file is not complicated, just have a
look at the source code.
6. 成果
沒有留言:
張貼留言