PHP table + pdfMake + AngularJS
PHP table + pdfMake + AngularJS
我是 PHP 和 AngularJS 的菜鸟。
我有一个网页可以通过 PHP - AJAX 与 Web 服务通信。它查询数据库,并在 html 占位符中回显结果(一个大的 table)。
我想在用户按下按钮时在可下载的 PDF 文件中打印 table 的内容。
我想使用 PDFmake,现在它可以很好地用于测试目的,但是如何将我的 table 的内容传递给 AngularJS' 应用程序?
也许我应该将 table 的 id 传递给 docDefinition 内容?那样的话我就不知道怎么办了。
注意:也许我的方法不正确,因为我必须将 PHP 分配给不同的任务并使用 AngularJS 查询数据库,但现在我想维护这个方法。
谢谢
我建议您使用 angular 服务(如 文档中所述
)
var bigTableApp = angular.module('bigTable',[])
bigTableApp.factory('BigTableSrv', ['$resource',
function($resource) {
return $resource('URL_to_php_backend', {}, {
query: {
method: 'GET',
params: {param1: 'value 1', param2: 'value 2'},
isArray: true
}
});
}
]);
然后,您可以在控制器中使用它从后端获取数据并在 PDFmake 的 table format:
中构建一个 table 结构
bigTableApp.controller('BigTableController', ['$scope', 'BigTableSrv',
function BigTableController($scope, BigTableSrv) {
$scope.bigTable = BigTableSrv.query();
$scope.pdfMakeTable = {
// array of column widths, expand as needed
widths: [10, *, 130],
body: []
};
$scope.printTable = function() {
pdfMakeTable.body = $scope.bigTable.map(el => {
// process each element of your "big table" to one line of the
// pdfMake table, size of return array must match that of the widths array
return [el.prop1, el.prop2, el.prop3]
});
// create the pdfMake document
let docDefinition = {
content: [ pdfMakeTable ]
}
// print your pdf
pdfMake.creatPdf(docDefinition).print()
}
}
]);
我是 PHP 和 AngularJS 的菜鸟。
我有一个网页可以通过 PHP - AJAX 与 Web 服务通信。它查询数据库,并在 html 占位符中回显结果(一个大的 table)。
我想在用户按下按钮时在可下载的 PDF 文件中打印 table 的内容。
我想使用 PDFmake,现在它可以很好地用于测试目的,但是如何将我的 table 的内容传递给 AngularJS' 应用程序? 也许我应该将 table 的 id 传递给 docDefinition 内容?那样的话我就不知道怎么办了。
注意:也许我的方法不正确,因为我必须将 PHP 分配给不同的任务并使用 AngularJS 查询数据库,但现在我想维护这个方法。
谢谢
我建议您使用 angular 服务(如 文档中所述 )
var bigTableApp = angular.module('bigTable',[])
bigTableApp.factory('BigTableSrv', ['$resource',
function($resource) {
return $resource('URL_to_php_backend', {}, {
query: {
method: 'GET',
params: {param1: 'value 1', param2: 'value 2'},
isArray: true
}
});
}
]);
然后,您可以在控制器中使用它从后端获取数据并在 PDFmake 的 table format:
中构建一个 table 结构bigTableApp.controller('BigTableController', ['$scope', 'BigTableSrv',
function BigTableController($scope, BigTableSrv) {
$scope.bigTable = BigTableSrv.query();
$scope.pdfMakeTable = {
// array of column widths, expand as needed
widths: [10, *, 130],
body: []
};
$scope.printTable = function() {
pdfMakeTable.body = $scope.bigTable.map(el => {
// process each element of your "big table" to one line of the
// pdfMake table, size of return array must match that of the widths array
return [el.prop1, el.prop2, el.prop3]
});
// create the pdfMake document
let docDefinition = {
content: [ pdfMakeTable ]
}
// print your pdf
pdfMake.creatPdf(docDefinition).print()
}
}
]);