dnp_akil
dnp_akil

Reputation: 105

How to render dynamic tables in html while exporting it another file

module.exports = (items) => {
return `
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Sample</title>
</head>
<body>
  <table>
    <tr>
      // dynamic render
    </tr>
  </table>
</body>
</html>`
}

I want to render a dynamic array like items in the //dynamic render section how can I add it there ?

Upvotes: 0

Views: 58

Answers (1)

Nitzy
Nitzy

Reputation: 260

You can create the template and then replace whatever dynamic stuff you want to render in it like below

let template = `<!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Sample</title>
    </head>
    <body>
      <table>
        <tr>
         {{dynamicPart}}
        </tr>
      </table>
    </body>
    </html>`;
    
// assuming list is an array ['a', 'b', 'c']
module.exports = (items) => {
    let data = '';
    // creating dynamic data
    for (const item of items) {
        data += `<td>${item}</td>`;
    }
    // replacing placeholder with actual data and returning
    return template.replace('{{dynamicPart}}', data);
}

Upvotes: 1

Related Questions