系列文章
實戰使用Axure設計App,使用WebStorm開發(1) – 用Axure描述需求
實戰使用Axure設計App,使用WebStorm開發(2) – 創建 Ionic 項目
實戰使用Axure設計App,使用WebStorm開發(3) – 構建頁面架構
實戰使用Axure設計App,使用WebStorm開發(4) – 實現頁面UI
實戰使用Axure設計App,使用WebStorm開發(5) – 實現頁面功能
實戰使用Axure設計App,使用WebStorm開發(6) – 邁向后端
接上一篇系列文章，在本文中，將進一步的去實現頁面功能。去實現輸入頁面功能，二維碼掃描功能。完成App的前端工作。
輸入頁面
當派送員輸入訂單號碼的時候，首先檢查一下單號是否有效，如果有效直接進入訂單詳情頁面，如果無效則提示訂單無效，提示用戶重新輸入。
最后完成的效果
掃描二維碼頁面
首先安裝 Barcode Scanner 支持 http://ngcordova.com/docs/plugins/barcodeScanner/
| cordova plugin add https://github.com/wildabeast/BarcodeScanner.git |
然后安裝 ng-cordova https://github.com/driftyco/ng-cordova/releases 下載Javascript 文件，將文件放到lib/angular下，並在 index 里引入 ng-cordova的引用 
在 app 里 注入 ngCordova
最后就是使用 $cordovaBarcodeScanner 對象，分別處理掃描成功和失敗的操作。
由於掃描功能打開了一個單獨的攝像頭頁面，在這個頁面就可以完成掃描功能了，所以之前設計的掃描頁面可以不用了。
掃描功能需要連接實際的機器才能測試，模擬器不好測試掃描功能。
到這里所有的頁面基礎功能就完成了，在下一篇中將連接后端服務，實現用戶登錄功能，並去掉前端的MockDB，使用服務器端的數據。
本階段代碼可以在 https://github.com/zhangsichu/DeliveryApp/releases/tag/PageFunctions 下載到。 也可以 git checkout PageFunctions
| git checkout PageFunctions |