Generate HTML Canvas from AngularJS Template

Question

I am trying to render html element on canvas using html2canvas JS. But I am using AngularJS for data binding on html page and the dynamic data is not rendered on generated canvas from these html elements. For example, I have an html element like this:

<table class="table table-striped table-bordered table-hover">
    <tr>
        <th>Name</th>
        <th>URI</th>
        <th>Is Default</th>
        <th>Action</th>
    </tr>
    <tr ng-repeat="printer in printers">
        <td>{{printer.name}}</td>
        <td>{{printer.url}}</td>
        <td>{{printer.default}}</td>
        <td><button ng-click="printTestPage(printer.url)">Print Test Page</button></td>
    </tr>
</table>

But we can see that the dynamic data is not rendered on canvas:

Any suggestions regarding how to do it properly, with or without using html2canvas js???

Answer 1

When do you call the html2canvas? You should call the function after the dom renderd