我在 Angular4 中使用反应式形式。我想实现同样的打印功能。但是，打印时不会显示反应形式值。我怎样才能实现这个目标？下面发布我的代码：
html
<section id="print-section">
<form [formGroup]="myForm" novalidate>
<div class="form-child input-wrap">
<span>Date</span>
<input type="text" placeholder="Date" class="borderStyle form-control" formControlName="date">
</div>
<div class="form-child input-wrap">
<span>Address</span>
<input type="text" placeholder="Address" class="borderStyle form-control" formControlName="address">
</div>
</form>
</section>
ts
let printContents, popupWin;
printContents = document.getElementById('print-section').innerHTML;
popupWin = window.open('', '_blank', 'top=0,left=0,height=100%,width=auto');
popupWin.document.open();
popupWin.document.write(`
<html>
<head>
<title>Print tab</title>
<style>
</style>
</head>
<body onload="window.print();window.close()">${printContents}</body>
</html>`
);
popupWin.document.close();
这条线
let printContents, popupWin;
printContents = document.getElementById('print-section').innerHTML;
根据编码不正确，这就是我的以下答案不起作用的原因。如果您使用反应式表单方法，那么您应该在 ts 文件中创建，如下所示
export class HeroDetailComponent3 {
printContents: FormGroup;
constructor(private fb: FormBuilder) { // <--- inject FormBuilder
this.createForm();
}
createForm() {
this.printContents= this.fb.group({
date: '',
address: ''
});
}
}
检查这里的详细信息：https://angular.io/guide/reactive-forms https://angular.io/guide/reactive-forms
如果你想要表单值，请这样做
const json = JSON.stringify( this.printContents.value );
<body onload="window.print();window.close()">${json }</body>
或尝试一下
我不确定，但你可能需要使用多姆消毒剂 https://angular.io/api/platform-browser/DomSanitizer，因为您试图将 html 元素从 Angular 中放入。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
