Как отобразить вложенный Json в формате jspdf angular8 - PullRequest
Новая
       34

Как отобразить вложенный Json в формате jspdf angular8

0 голосов
/ 07 февраля 2020

Мое требование загрузить дату в формате PDF. За исключением вложенных json остальные элементы заполняются в PDF. Вложенный Json отображается как {Object Object}. Я перепробовал множество решений, предложенных в inte rnet, но не нашел решения.

Может кто-нибудь дать мне предложение.

jspdf, angular8

Облачения, которые не отображаются в PDF 

 var columns = [
            {title: "ID", dataKey: "id"},
            {title: "Name", dataKey: "name"}, 
            {title: "Country", dataKey: "address"}
        ];

Содержимое, отображаемое в PDF, столбцы и строки отображаются с помощью dataKey. Id и Name оба являются отдельными элементами в JsonArray, но поле адреса является вложенным JsonObject. Я пытаюсь получить доступ к address.country, но он не отображается. 

        var rows = [
            {id: 1, name: "chakri", address: {country: "Tanzania"}},
            {id: 2, name: "hari", address: {country: "Kazakhstan"}},
            {id: 3, name: "venki", address: {country: "Madagascar"}}
        ];

id, значения имен заполнены, но адрес вложен json файлы стран не заполняются в формате PDF вместо страны, в которой он находится показывает [объект объекта] 

    exportPdf() {
                import("jspdf").then(jsPDF => {
                    import("jspdf-autotable").then(x => {
                        const doc = new jsPDF.default(0,0);
                        doc.autoTable(this.columns, this.rows);
                        doc.save('primengTable.pdf');
                    })
                })
            }

1 Ответ

1 голос
/ 07 февраля 2020

Я провел еще несколько исследований и, используя в качестве руководства Access вложенное свойство JSON в плагине jspdf autotable , я нашел решение, которое получает свойство страны.

JSFiddle to посмотреть, как это работает: https://jsfiddle.net/mu4v06dh/1/

var columns = [
    {title: "ID", dataKey: "id"},
    {title: "Name", dataKey: "name"}, 
    {title: "Country", dataKey: "address", displayProperty: "country"}
];
var rows = [
    {id: 1, name: "Shaw", address: {country: "Tanzania"}},
    {id: 2, name: "Nelson", address: {country: "Kazakhstan"}},
    {id: 3, name: "Garcia", address: {country: "Madagascar"}}
];

var doc = jsPDF();
doc.autoTable({
	body: rows,
  columns: columns,
  didParseCell: function(data) {
   if (data.column.raw.displayProperty) {
   		var prop = data.column.raw.displayProperty;
      var text = data.cell.raw[prop];
      if (text && text.length > 0) {
      	data.cell.text = text;
      }
   }
}
});
doc.save('table.pdf');
<script src="https://unpkg.com/jspdf@1.3.3/dist/jspdf.min.js"></script>
<script src="https://unpkg.com/jspdf-autotable@3.2.11/dist/jspdf.plugin.autotable.js"></script>
...