Question

我的网络应用程序中有打印功能。我使用jquery打印插件在打印预览中只显示dom中的几个元素。我想确保只有在渲染完所有数据后才开始打印。在当前的实现中 - 有时打印预览显示并不是dom中的所有信息（我认为ng2使用某种延迟操作）。

看看样本：

@Component(...)
export class MyCoolComponent{|

myModel:MyModel;


print(){
   _myService.fetchDataSomehow().subscribe((newData:MyModel)=>{
       this.myModel = newData;
       // I need to wait until ng2 will adjust dom with new data in synchronous manner
       $(this._el).print();
   })
}
}

模板：

<div>
  {{myModel.field1}}
  {{myModel.field2}}
  {{myModel.field3}}
  //...and a lot of other fields from myModel
</div>

我知道我可以使用setTimeout(()=>{...}, 1)，但看起来很傻。是否有更坚实的方法等待角度2调整dom由于模型的变化？

Answer 1

在docs结帐ngAfterViewChecked，也许这就是你要找的。

Answer 2

另一种方法是将*ngIf添加到您的HTML中。

如果您希望在myModel中有值之前不渲染任何内容，请执行类似。

之类的操作

<div *ngIf="myModel">
  {{myModel.field1}}
  {{myModel.field2}}
  {{myModel.field3}}
</div>

这将检查myModel是否有值。如果是，那么它将呈现。

您还可以通过检查myModel是否没有值并正确处理来添加“加载文本”

<div *ngIf="!myModel">
     Fetching Data...
</div>

如何等到ng2完成更改DOM

2 个答案: