UI-Grid-Tabelle PDF-Export

Question

Ich muss Ui-Grid-Tabelle exportieren, habe ich alle so http://ui-grid.info/docs/#/tutorial/312_exporting_data_complex, im Ergebnis funktioniert CVC-Export, aber PDF-Export funktioniert nicht. In cosole bekomme ich Fehler: "pdfmake.min.js: 1 Uncaught TypeError: Kann Eigenschaft 'Standort' von null nicht lesen" Wie kann ich dieses Problem lösen?

(PS PDF-Export funktioniert nicht nur mit benutzerdefinierter UI, mit ui-Grid-Menü funktioniert)

class UserTableController { 
    constructor(FiredbAutorisation, $scope) { 
    'ngInject'; 
    this.FiredbAutorisation = FiredbAutorisation; 
    this.FiredbAutorisation.responseData().then(res => { 
    this.userData = res.userData; 
    }); 

this.users = this.FiredbAutorisation.getUserDetails(); 
this.scope = $scope; 


this.gridOptions = { 
    enableFiltering: true, 
    exporterMenuCsv: true, 
    enableGridMenu: true, 
    enableSorting: true, 
    enableSelectAll: true, 
    exporterOlderExcelCompatibility: true, 
    exporterCsvFilename: 'userDetails.csv', 
    exporterPdfDefaultStyle: {fontSize: 9}, 
    exporterPdfTableStyle: {margin: [30, 30, 30, 30]}, 
    exporterPdfTableHeaderStyle: {fontSize: 10, bold: true, italics: true, color: 'blue'}, 
    exporterPdfHeader: { text: 'Users Details Table', style: 'headerStyle' }, 
    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: 'LETTER', 
    exporterPdfMaxGridWidth: 600, 
    exporterCsvLinkElement: angular.element(document.querySelectorAll('.custom-csv-link-location')), 

    onRegisterApi: function(gridApi){ 
    $scope.gridApi = gridApi; 

    }, 


    columnDefs: [ 
     { name:'Name', enableSorting: true, field: 'name'}, 
     { name:'Surname', enableSorting: true, field: 'surname'}, 
     { name:'Nickname', enableSorting: true, field: 'login'}, 
     { name:'Birth Date', enableSorting: true, field: 'birthDate'}, 
     { name:'Email', enableSorting: true, width:230, field: 'email'}, 
     { name:'Country', enableSorting: true, field: 'country'}, 
     { name:'City', enableSorting: true, field: 'city'}, 
     { name:'Registration date', enableSorting: true, width:150, field: 'signUpDate'}, 
     { name:'Number of Inputs', enableSorting: true, width:200, field: 'logInCount'}, 


    ], 
    data: this.users 
    }; 

} 



export(exportData){ 
    this.export_format = exportData.format; 
    this.export_column_typee = exportData.column; 
    this.export_row_type = exportData.raw; 

if (this.export_format === 'csv') { 
    let myElement = angular.element(document.querySelectorAll('.custom-csv-link-location')); 
    this.scope.gridApi.exporter.csvExport(this.export_row_type, this.export_column_type, myElement); 
} else if (this.export_format === 'pdf') { 
    this.scope.gridApi.exporter.pdfExport(this.export_row_type, this.export_column_type); 
    }; };  } 

export default UserTableController; 

Exportdata es Daten über Format, Spalte, roh, die ich von md-Dialog erhalten , die in anderen Komponente befindet

Answer 1

Ich konfrontiert das ähnliche Problem!

Sie müssen beide pdfmake.min.js und vfs_fonts.js enthalten (https://github.com/bpampuch/pdfmake)