Question

在打印页面时，我试图借助 ngIf 指令隐藏两列。

当我按下打印按钮时，将布尔变量' print '的值切换为true，然后执行转换为PDF的功能。

  <div class="portlet light">
      <button class="btn btn-danger noprint pull-right" style="margin-bottom: -30px; " (click)="print_table()"> <i class="fa fa-print"></i> Imprimer</button>
      {{print}}
  </div>

转换为PDF的功能

convertToPdf() {
 const element = document.getElementById('contentToConvert');
 const opt = {
  margin: 0.2,
  filename: 'myfile.pdf',
  image: { type: 'jpeg', quality: 0.98 },
  html2canvas: { scale: 2, width: 1282 },
  jsPDF: { unit: 'mm', format: 'a4', orientation: 'landscape' }
 };

 // New Promise-based usage:
 html2pdf().from(element).set(opt).save();

}

问题在于，即使在控制台中更改了该值，它也没有在模板中更改。

print_table() {
 this.print = true;
 setTimeout(this.convertToPdf, 2000);
 setTimeout(this.toFalse, 5000);
}

toFalse() {
 this.print = false;
 console.log(this.print);
}

结果：
'print'的值仅更改一次，因此在知道我调用了toFalse()函数来显示它们之后，列在打印函数之后保持隐藏状态。

Answer 1

如果您将其引用传递给this，则toFalse中的

setTimeout将成为窗口对象，因为setTimeout和setInterval在全局范围内运行。

在您的print_table()函数中，直接在匿名函数的引用内部调用toFalse()函数，而不要传递该引用，即：

print_table() {
 this.print = true;
 setTimeout(this.convertToPdf, 2000);
 setTimeout(()=>{this.toFalse()}, 5000);
}

角度5：控制台和模板之间的区别

1 个答案: