Question

我有这种印刷方法：

print(data): void {
    console.log(data);
  let printContents, popupWin;
    popupWin = window.open();
    popupWin.document.write(`
    <html>
        <head>
        <title>Print tab</title>
        <style>
            table {
                font-family: arial, sans-serif;
                border-collapse: collapse;
                width: 100%;
            }

            td, th {
                border: 1px solid #dddddd;
                text-align: left;
                padding: 8px;
            }

            tr:nth-child(even) {
                background-color: #dddddd;
            }
        </style>
        </head>
    <body onload="window.print()">
       <table>
        <tr>
            <th>Šifra usluge</th>
            <th>Naziv usluge</th>
            <th>Datum dospijeca</th>
            <th>Iznos rate</th>
        </tr>
        for (let entry of someArray) {
        <tr>
            <td>{{entry.name}}}</td>
            <td>{{entry.code}}</td>
            <td>{{entry.something}}</td>
            <td>{{entry.something2}}</td>
        </tr>
        }


        </table>
    </body>
    </html>`
    );
    popupWin.document.close();
}

我想要的是在模板中添加此循环以显示所有数据。任何建议我怎么能这样做？

Answer 1

试试这个：

print(data): void {
    console.log(data);
  let printContents, popupWin;
    popupWin = window.open();
    var trHtml = "";
    for (let entry of someArray) {
        trHtml += `<tr>
                        <td>`+entry.name+`</td>
                        <td>`+entry.code+`</td>
                        <td>`+entry.something+`</td>
                        <td>`+entry.something2+`</td>
                    </tr>`;
    }
    popupWin.document.write(`
    <html>
        <head>
        <title>Print tab</title>
        <style>
            table {
                font-family: arial, sans-serif;
                border-collapse: collapse;
                width: 100%;
            }

            td, th {
                border: 1px solid #dddddd;
                text-align: left;
                padding: 8px;
            }

            tr:nth-child(even) {
                background-color: #dddddd;
            }
        </style>
        </head>
    <body onload="window.print()">
       <table>
        <tr>
            <th>Šifra usluge</th>
            <th>Naziv usluge</th>
            <th>Datum dospijeca</th>
            <th>Iznos rate</th>
        </tr>
        `+trHtml+`
        </table>
    </body>
    </html>`
    );
    popupWin.document.close();
}

如何在打印模板中添加循环？

1 个答案: