我在嘗試使用AngularJS和ng-grid來模擬電子表格。我的需求很簡單,但我找不到任何能夠幫助我修復代碼的任何地方。angularjs ng-grid計算列
我有一個簡單的分數表,在最後一欄我需要一個「總分」欄。
你可以在這裏看到我的代碼plunk。
我的問題是,儘管我能夠在document.load的每一行中獲得總數,但是無論何時更改任何分數,我都無法更新「Total」列。
我在嘗試使用AngularJS和ng-grid來模擬電子表格。我的需求很簡單,但我找不到任何能夠幫助我修復代碼的任何地方。angularjs ng-grid計算列
我有一個簡單的分數表,在最後一欄我需要一個「總分」欄。
你可以在這裏看到我的代碼plunk。
我的問題是,儘管我能夠在document.load的每一行中獲得總數,但是無論何時更改任何分數,我都無法更新「Total」列。
或者,你可以直接添加getTotal()
函數模型對象:
http://plnkr.co/edit/LhlK1C?p=preview
我喜歡的解決方案,我沒有與$watch()
工作,但它取決於如果您希望將總數存儲在您的模型中或只需要將其顯示出來。
與Chrome中的Batarang進行快速的性能比較表明,我的解決方案可能會讓我的性能略高於Clark,但這必須進行更詳細的調查。一個解釋可能是,克拉克的解決方案必須爲每個單元更新創建整個數據樹的2個深度副本(首先是用戶更改,其次是整體更改),而我只需創建一個副本。 – vsp
我喜歡這個解決方案,但是如何將'original_data'模型與附加列一起取回?有沒有一種解決方案,我不需要創建2份數據樹? – dashmug
解決了我的問題,謝謝。 此外,我更喜歡在檢索數據的服務中添加計算字段,位於「transfromResponse」函數內部,以便控制器只接收帶有字段的數據。 – Thomas
您可以觀察「original_data」對象的更改,並在每次更新時重新創建process_data
對象。
我已閱讀過$ scope。$ watch,但從未真正理解如何使用它現在。謝謝。 – dashmug
我創建了由Clark Pan提交的上述示例的變體。 columns數組有一個key:value對(year和salesCount)的列表。具有saleCount的列的columnDefs是動態生成的。這樣,您可以在不更改columnDefs的情況下向列數組添加更多項目。
「Total」列在哪裏? – Cherniv
目前還不支持編輯單元的回調。你可以嘗試實現它。 https://github.com/angular-ui/ng-grid/issues/282 – zsong
@sza我多麼希望自己能夠熟練地實施它! – dashmug