Javascript – Calling $window.print() in angularjs causes the print preview to show a blank page

angularjscsshtmljavascriptprinting

I have a very strange problem where, when I call $window.print in angularjs, all I see is the date on the top left, page name on the top, page number on the bottom right, and the url on the bottom left. However, there is no other content on the page, which is very weird since the regular page has plenty of content.

I guess of mine is that this has to do with an ng-view I have on the page, but I'm not too sure. I would add a print style sheet, but my problem is more on the side that there is no content to style to begin with. Any ideas?

Best Answer

Try to use(don't forget to inject service $timeout):

$timeout(function() {
    $window.print();
})

I think your problem in that angular haven't finishes the digest cycle and updates the DOM.

Related Solutions

Html – How to get a div to float to the bottom of its container

Set the parent div to position: relative, then the inner div to...

position: absolute; 
bottom: 0;

...and there you go :)

Html – CSS3’s border-radius property and border-collapse:collapse don’t mix. How to use border-radius to create a collapsed table with rounded corners

I figured it out. You just have to use some special selectors.

The problem with rounding the corners of the table was that the td elements didn't also become rounded. You can solve that by doing something like this:

table tr:last-child td:first-child {
    border-bottom-left-radius: 10px;
}

table tr:last-child td:last-child {
    border-bottom-right-radius: 10px;
}

Now everything rounds properly, except that there's still the issue of border-collapse: collapse breaking everything.

A workaround is to add border-spacing: 0 and leave the default border-collapse: separate on the table.

Best Answer

Related Solutions

Html – How to get a div to float to the bottom of its container

Html – CSS3’s border-radius property and border-collapse:collapse don’t mix. How to use border-radius to create a collapsed table with rounded corners

Related Topic