Drucken Sie ein Div mit Javascript in der AngularJS-Einzelseitenanwendung

Ich habe eine einseitige Webanwendung mit angularJS. Ich muss einen Teil einer bestimmten Seite drucken. Ich habe folgendes versucht:

Die Seite enthält einige div (print.html)

<div>
  <div>
    Do not print
  </div>
  <div id="printable">
    Print this div
  </div>
  <button ng-click="printDiv('printableArea');">Print Div</button>
</div>

Der Controller hat folgendes Skript:

$scope.printDiv = function(divName) {
    var printContents = document.getElementById(divName).innerHTML;
    var originalContents = document.body.innerHTML;        
    document.body.innerHTML = printContents;
    window.print();
    document.body.innerHTML = originalContents;
}

Dieser Code gibt das gewünschte Div aus, aber es liegt ein Problem vor. die Aussagedocument.body.innerHTML = originalContents; ersetzt den Hauptteil der gesamten Anwendung, da es sich um ein SPA handelt. Wenn ich die Seite aktualisiere oder erneut auf die Schaltfläche "Drucken" klicke, wird der gesamte Inhalt der Seite gelöscht.

Antworten auf die Frage(7)

Ihre Antwort auf die Frage