ngIf的工作原理比隐藏属性快得多吗？

Question

我只是在思考ngif的工作方式。由于必须在html文件中指定标记，因此在可见组件时将加载该标记。在整个元素加载到dom之后，Angular决定渲染/不渲染？它比渲染时隐藏起来快很多吗？

Answer 1

ngIf仅在true时在DOM中创建元素。 ngShow总是在DOM中创建元素，但仅显示/隐藏它。因此，除非您具有某些功能要求元素必须始终存在于要访问的DOM中，否则应使用ngIf来使DOM更轻便，性能更高。

Answer 2

  

*ngIf完全将其从DOM中删除，同时hidden属性只是将display: none样式设置为元素（它在DOM中但已隐藏）。

两者在性能上都是相同的，因为它们都是有角度的共同属性(*ngIf === [ngIf])，并且在有角度的渲染时效果相同。

Answer 3

* ngIf的另一个重要点是，当条件变为false时，将调用ngOnDestroy生命周期挂钩，而当条件再次变为true时，将再次调用ngOnInit生命周期挂钩，依此类推。因此，您可能也要注意这一点。

Answer 4

ngIf 是结构化指令，如果表达式为true，则呈现DOM的一部分。 另一方面，隐藏属性不会从DOM中删除元素，它仍然存在，但不会显示它。