我一直试图打印修改后的html元素，但元素没有改变。（Angular2）这个源代码是简化的一个。
<div *ngIf="displayType === 'screen'">
<div>This is Screen</div>
</div>
<div *ngIf="displayType === 'print'">
<div>This is Print</div>
</div>当点击一个按钮时，会发生以下事件。
displayType: string = 'screen'; // default
OnPrint() {
this.displayType = 'print';
let tmp = document.createElement('div');
let el = this.elementRef.nativeElement.cloneNode(true);
tmp.appendChild(el);
let content = tmp.innerHTML;
let frame1 = document.createElement('iframe');
document.body.appendChild(frame1);
let frameDoc = frame1.contentWindow;
frameDoc.document.open();
frameDoc.document.write('<html><body>'+content+'</body></html>');
frameDoc.document.close();
setTimeout(function () {
window.frames["frame1"].focus();
window.frames["frame1"].print();
document.body.removeChild(frame1);
}, 500);
}但内容是修改前的元素。如何刷新元素？
1条答案
按热度按时间kr98yfug1#
要刷新元素，您需要触发更改检测。这是一篇关于Angular 2中的变化检测的很好的文章：http://blog.thoughtram.io/angular/2016/02/22/angular-2-change-detection-explained.html
我在这里创建了一个plunker来说明它：http://plnkr.co/edit/0ZwkaQ776mKpLYZJogYx?p=preview
另外，你不应该直接修改DOM元素，你应该创建一个组件，并使用一个结构化指令来显示它（这里的组件有一个选择器“my-print”）：