Angularjs ui-grid导出功能,在exporterPdfHeader中显示动态数据

时间:2019-07-05 12:16:27

标签: angularjs

使用Angularjs,ui-grid和uiGridExporterService在网格视图中导出数据。我在报表功能中使用了此导出选项,因此在导出(PDF)时,需要在PDF视图中显示过滤后的输入。

$scope.gridOptions2 = {
    enableSorting: true,      
    enableColumnMenus: false,  
      columnDefs: [        
      // { field: 'id', width: '60', displayName: 'S.No', cellTemplate: ''},     
      // { field: 'id',   displayName: 'S.No', visible: false},     
      { field: 'reg_id',  width: '130',   displayName: 'Id', enableSorting: false},     
      { field: 'name', width: '160', displayName: 'Username', enableSorting: false}
      ], 
      exporterMenuCsv: false, // ADD THIS

      exporterPdfDefaultStyle: {fontSize: 11},
      exporterPdfTableStyle: {margin: [10, 30, 30, 30]},
      exporterPdfTableHeaderStyle: {fontSize: 11, bold: true, italics: false, color: 'blue' },

      exporterPdfHeader: { 
        margin: 20,
        columns: [{
          text: "Employee Salary Detail", alignment: 'center', style: 'defaultStyle',
          text: "Month : "+ $scope.monthVal, alignment: 'right', style: 'defaultStyle',
          width: 150
        }]         
    },   
      exporterFieldCallback : function ( grid, row, col, value ) {
        if ( col.name === 'status' ) {
          value = decodeStatus( value );
        }
        return value;
      },       
      exporterPdfFooter: function ( currentPage, pageCount ) {
        return { text: currentPage.toString() + ' of ' + pageCount.toString(), style: 'footerStyle' };
      },
      exporterPdfCustomFormatter: function ( docDefinition ) {
        docDefinition.styles.headerStyle = { fontSize: 22, bold: true };
        docDefinition.styles.footerStyle = { fontSize: 10, bold: true };
        return docDefinition;
      },

      exporterPdfOrientation: 'landscape',
      exporterPdfPageSize:'A4',  // exporterPdfMaxGridWidth = Defaults to 720 (for A4 landscape), use 670 for LETTER
      exporterPdfMaxGridWidth: 600,    // bug, for A4, default is 720, set to 600 solve my problem.  
      exporterExcelFilename: 'myFile.xlsx',
      exporterExcelSheetName: 'Sheet1',         
      onRegisterApi: function (gridApi) {        
        $scope.grid2Api = gridApi;        
    }           
  };

需要将选定的输入传递到$scope.monthVal中。

exporterPdfHeader: { 
        margin: 20,
        columns: [{
          text: "Employee Salary Detail", alignment: 'center', style: 'defaultStyle',
          text: "Month : "+ $scope.monthVal, alignment: 'right', style: 'defaultStyle',
          width: 150
        }]         
    },

0 个答案:

没有答案