2014年10月12日 星期日

ionic 實作(6):本月消費

說明
本月消費功能,主要是要用來統計當月消費的記錄與總金額。


UI 畫面


設計的畫面如下
打開 tab-consumer.html 修改內容如下,在這邊有使用了 inline style 去處理,這個部份在之後refactor的介紹會再做調整


測試出來的畫面如下




Controller 撰寫


接著修改controller,從 js/app.js 的function 中可以看到本月消費的tab-consumer.html 對應的controller為 ConsumerCtrl


打開controller.js ,找到 ConsumerCtrl修改內容如下,把list($scope.order_list)部份先以陣列的資料來呈現
最後把tab-consumer.html 的內容改抓取controller 中的變數


大功告成,之後在取得今日訂餐會在介紹到$http時會再refactor

沒有留言:

張貼留言