I utilize ng-grid to implement the grid as bellows:
The value of 利率 has 4 decimal places, customer ask to change to 2 decimal places.
The ng-grid definition is as following:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 | $scope.itemGrid = { multiSelect : false, data : 'itemData', showFooter : false, keepLastSelected: false, enableColumnResize: true, columnDefs : [ { field : 'fundName', displayName : '借入基金專戶', width : '21%', cellClass : "text-left", cellFilter:'dbm035eFundFilter:row.entity.toFundName : row.entity.debtType=="B"' }, { field : 'toFundName', displayName : '借出基金專戶', width : '21%', cellClass : "text-left", cellFilter:'dbm035eFundFilter:row.entity.fundName : row.entity.debtType=="B"' }, { field : 'debtDateB', displayName : '調借起日', width : '10%', cellClass : "text-left", cellFilter:"dbm035eToStringFilter|dateFilter" }, { field : "debtDateE", displayName : "調借迄日", width : '10%', cellClass : "text-left", cellFilter:"dbm035eToStringFilter|dateFilter" }, { field : "debtAmt", displayName : "調借金額", width : '10%', cellClass : "text-right", cellFilter:"dbm035eAmountFilter | number" }, { field : "debtRate", displayName : "利率", width : '8%', cellClass : "text-right" }, { field : "remark", displayName : "備註", width : '20%', cellClass : "text-left" } //.... }]; |
How-To
Step 1. Create a cellFilter to debtRate field
1 2 3 4 5 | app.filter('dbm035eRateFilter', function() { return function(input) { return null==input?null:(Math.round(input * 100)/100); }; }); |
Step 2. Add this cellFilter to debtRate field
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 | $scope.itemGrid = { multiSelect : false, data : 'itemData', showFooter : false, keepLastSelected: false, enableColumnResize: true, columnDefs : [ { field : 'fundName', displayName : '借入基金專戶', width : '21%', cellClass : "text-left", cellFilter:'dbm035eFundFilter:row.entity.toFundName : row.entity.debtType=="B"' }, { field : 'toFundName', displayName : '借出基金專戶', width : '21%', cellClass : "text-left", cellFilter:'dbm035eFundFilter:row.entity.fundName : row.entity.debtType=="B"' }, { field : 'debtDateB', displayName : '調借起日', width : '10%', cellClass : "text-left", cellFilter:"dbm035eToStringFilter|dateFilter" }, { field : "debtDateE", displayName : "調借迄日", width : '10%', cellClass : "text-left", cellFilter:"dbm035eToStringFilter|dateFilter" }, { field : "debtAmt", displayName : "調借金額", width : '10%', cellClass : "text-right", cellFilter:"dbm035eAmountFilter | number" }, { field : "debtRate", displayName : "利率", width : '8%', cellClass : "text-right", cellFilter:"dbm035eRateFilter" }, { field : "remark", displayName : "備註", width : '20%', cellClass : "text-left" } //.... }]; |
Check the result
Reference
[1] http://stackoverflow.com/questions/11832914/round-to-at-most-2-decimal-places-in-javascript