我爲我的UI網格創建了一個自定義過濾器,我使用ui-grid-exporter作爲pdf將其導出爲限制十進制數字到兩個地方的pdf,並且當我導出ui-grid,但它在導出器時不能在頁腳內工作。UI Grid AngularJS:將自定義過濾器應用到頁腳
頁腳 預計:32.34452436927346234523623462342345 需要:32.34
這裏是自定義過濾器。此過濾器在ui網格內工作。
app.filter('rentalFilter', function() {
return function (value, scope) {
// Only perform logic if the value is actually defined
if(typeof value != 'undefined') {
if(value == null || value == "")
value = 0;
value = value.toFixed(2);
if(value >= 0) {
var parts=value.toString().split(".");
return parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",") + (parts[1] ? "." + parts[1] : "");
}
else {
value = value * -1.00;
value = value.toFixed(2);
var parts=value.toString().split(".");
return "-" + parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",") + (parts[1] ? "." + parts[1] : "");
}
}
};
});
這裏列宣佈對UI電網
$scope.columns = [ {
name : 'parm',
category : "column1",
width : '6%',
enableColumnMenu : false,
displayName : $scope.rollup
}, {
name : 'mondayAwrv',
displayName : 'AWRV',
cellClass : 'green',
category : "MONDAY",
exporterPdfAlign: 'right',
width : '6%',
cellFilter : 'number : 2',
footerCellFilter : 'number : 2',
aggregationType : uiGridConstants.aggregationTypes.sum,
aggregationHideLabel : true,
enableColumnMenu : false
}, {
name : 'mondayCredit',
cellClass : function(grid, row, col, rowRenderIndex, colRenderIndex) {
if (grid.getCellValue(row, col) < 0)
return 'negative';
return 'positive'
},
category : "MONDAY",
exporterPdfAlign: 'right',
width : '6%',
cellFilter : 'number : 2',
footerCellFilter : 'number : 2',
aggregationType : uiGridConstants.aggregationTypes.sum,
aggregationHideLabel : true,
enableColumnMenu : false
}, {
name : 'mondayPer',
displayName : '%',
category : "MONDAY",
exporterPdfAlign: 'right',
width : '6%',
cellFilter : 'number : 2',
footerCellFilter : 'number : 2',
aggregationType : uiGridConstants.aggregationTypes.avg,
aggregationHideLabel : true,
enableColumnMenu : false
},
.....
//and so on for other days of the week
];
導出功能導出UI格爲PDF。數字顯示有2位小數限制
$scope.export = function(){
//$scope.gridApi.exporter.pdfExport(uiGridExporterConstants.ALL, uiGridExporterConstants.ALL);
var exportData = [];
var exportColumnHeaders = $scope.gridOptions.showHeader ? uiGridExporterService.getColumnHeaders($scope.gridApi.grid, uiGridExporterConstants.VISIBLE) : [];
angular.forEach($scope.gridApi.grid.rows, function(row) {
if (row.visible) {
var values = [];
angular.forEach(exportColumnHeaders, function(column) {
var value = row.entity[column.name];
if (column.name == 'mondayAwrv' || column.name == 'mondayCredit' || column.name == 'mondayPer' ||
column.name == 'tuesdayAwrv' || column.name == 'tuesdayCredit' || column.name == 'tuesdayPer' ||
column.name == 'wednesdayAwrv' || column.name == 'wednesdayCredit' || column.name == 'wednesdayPer' ||
column.name == 'thursdayAwrv' || column.name == 'thursdayCredit' || column.name == 'thursdayPer' ||
column.name == 'fridayAwrv' || column.name == 'fridayCredit' || column.name == 'fridayPer') value = $filter('rentalFilter')(value);
values.push({
value: value
});
});
exportData.push(values);
}
});
var content = uiGridExporterService.prepareAsPdf($scope.gridApi.grid, exportColumnHeaders, exportData);
pdfMake.createPdf(content).open();
}
我想同樣適用於getFooterValue功能
$scope.getFooterValue = function(i){
return $scope.gridApi.grid.columns[i].getAggregationValue();
//template
//[ '', {text: ($scope.getFooterValue(1)), alignment: 'right'}, {text: ($scope.getFooterValue(2)), alignment: 'right'},
/*
var exportData = [];
var exportColumnHeaders = $scope.gridOptions.showHeader ? uiGridExporterService.getColumnHeaders($scope.gridApi.grid, uiGridExporterConstants.VISIBLE) : [];
angular.forEach($scope.gridApi.grid.rows, function(row) {
if (row.visible) {
var values = [];
angular.forEach(exportColumnHeaders, function(column) {
var value = row.entity[column.name];
if (column.name == 'mondayAwrv' || column.name == 'mondayCredit' || column.name == 'mondayPer' ||
column.name == 'tuesdayAwrv' || column.name == 'tuesdayCredit' || column.name == 'tuesdayPer' ||
column.name == 'wednesdayAwrv' || column.name == 'wednesdayCredit' || column.name == 'wednesdayPer' ||
column.name == 'thursdayAwrv' || column.name == 'thursdayCredit' || column.name == 'thursdayPer' ||
column.name == 'fridayAwrv' || column.name == 'fridayCredit' || column.name == 'fridayPer') value = $filter('rentalFilter')(value);
values.push({
value: value
});
});
exportData.push(values);
}
});
var content = uiGridExporterService.prepareAsPdf($scope.gridApi.grid, exportColumnHeaders, exportData);
content.pageMargins = [40, 80, 40, 60];
//pdfMake.createPdf(content).open();
return $scope.gridApi.grid.columns[i].getAggregationValue();
*/
}
這就是出口值頁腳。
$scope.gridOptions.exporterPdfFooter = {
margin: [10, 5, 20, 10],
table: {
widths: [ '6%', '6%', '6%', '6%', '6%', '6%', '6%', '6%', '6%', '6%', '6%', '6%', '6%', '6%', '6%', '6%', '6%',],
body: [
[ '', {text: ($scope.getFooterValue(1)), alignment: 'right'}, {text: ($scope.getFooterValue(2)), alignment: 'right'}, {text: ($scope.getFooterValue(3)), alignment: 'right'}, {text: ($scope.getFooterValue(4)), alignment: 'right'}, {text: ($scope.getFooterValue(5)), alignment: 'right'}, {text: ($scope.getFooterValue(6)), alignment: 'right'} ],
]
}
};
如何將過濾器應用到頁腳以限制2個小數點?
任何幫助,非常感謝。
的號碼被與主應用程序中的2號過濾器正確地示出,但是問題是當我導出內容以pdf格式。當我輸出ui-grid-footer時,這些數字並不反映pdf內部的變化。我相信這是我使用的$ scope.export中的主網格相同的技術,但我需要應用它不與列名稱,但與getFooterValue – Adrew
我怎麼能這樣做是我的問題 – Adrew