Inquiry: The use of ng-hide
with both text.name.length
and !text.name.length
results in the content being visible on the print preview. Why does this occur?
Personal Perspective
<div>
<div class="content" id="printable">
My name is <b data-ng-hide="text.name.length">__________</b><b data-ng-hide="!text.name.length">{{text.name}}</b>
</div>
<button data-ng-click="printDiv('printable')">Print</button>
</div>
This function controls the display of the print preview when printing
Printing Controller
app.controller('PrintController', function ($scope) {
$scope.printDiv = function (divName) {
var printContents = document.getElementById(divName).innerHTML;
var originalContents = document.body.innerHTML;
var popupWin = window.open('', '_blank', 'width=800,height=600');
popupWin.document.open()
popupWin.document.write('<html><head><link rel="stylesheet" type="text/css" href="style.css" /></head><body onload="window.print()">' + printContents + '</html>');
popupWin.document.close();
}
})