0

Estoy intentando generar un pdf desde una consulta a una base de datos, donde la información tiene código HTML, como listas. <p>DDDD</p><ol><li>asdasdas</li><li>asdasdasd</li><li>asdasdasd</li></ol><ul><li>sdasdasd</li></ul>

luego de instalar pdfmake y html-to-pdfmake, los importo en mi componente.ts

const pdfMake = require('node_modules/pdfmake/build/pdfmake')
const pdfFonts = require('node_modules/pdfmake/build/vfs_fonts')
pdfMake.vfs = pdfFonts.pdfMake.vfs
const htmlToPdfmake = require('html-to-pdfmake')

en algun momento mando a llamar al metodo donde se genera crea mi pdf

savePDF() {
    console.log(this.reConsulta)

    const documentDefinition = {
      pageSize: 'A5',
      pageOrientation: 'landscape',
      pageMargins: [5, 100, 5, 10],

      content: [
        { text: htmlToPdfmake(this.reConsulta.medicamentos) },
        { text: htmlToPdfmake(this.reConsulta.metodo), absolutePosition: { x: 320, y: 100 } },
      ],
    }

    pdfMake.createPdf(documentDefinition).open()
  }

en este momento this.reConsulta.medicamentos tiene el valor de la lista anterior <p>DDDD</p><ol><li>asdasdas</li><li>asdasdasd</li><li>asdasdasd</li></ol><ul><li>sdasdasd</li></ul>

pero cdo crea el pdf no se muestra la lista, sin embargo otras etiquetas html como <b></b> <i></i> se formatean sin problemas.

1 respuesta 1

0

Después de buscar y consultar algo mas la bibliografía, así como los desarrolladores de las librerías, el problema quedo resulto.

El problema se generaba en el momento de crear las columnas con pdfMake. El código corregido debe quedar de esta manera para que funcione.

  savePDF() {

    const documentDefinition = {
      pageSize: 'A5',
      pageOrientation: 'landscape',
      pageMargins: [20, 100, 20, 10],

      content: [
        {
          columns: [
            {stack: htmlToPdfmake(this.reConsulta.medicamentos),            },
            { stack: htmlToPdfmake(this.reConsulta.metodo) },
          ],
          columnGap: 5,
        },
      ],
    }

    pdfMake.createPdf(documentDefinition).open()
  }
}

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.