当ngIf由于DOM连接而显得优越时，使用[hidden] over * ngIf的优势是什么？

Question

使用[hidden]优于*ngIf是否有任何优势？ ngIf从DOM树中取出整个div，因此它可以减轻JS代码库的负担，而隐藏的只是扫描地毯下的东西。

在这种情况下，出现了一个问题;是否，选择[hidden]超过* ngIf有什么好处？

<div *ngIf="expression">{{val}}</div>

<div [hidden]="!expression">{{val}}</div>

Answer 1

\| 将从DOM中删除元素。

*ngIf 不会从DOM中删除元素。它使用CSS样式来隐藏/显示元素。

即使差异不大，使用 [hidden] 与 {{1}相比，使用 *ngIf 时，不在DOM中的第一种方式对性能的影响会更快}

Answer 2

像往常一样，这取决于您的需求。如果您根据具体用例对问题进行微调，我们可以提供更多有用的建议。

data_df_json = engagement_data_df.groupby('Items').apply(lambda df: data_df.drop('Items', axis=1).to_dict(orient='records')).to_json(date_format='iso') 将使用CSS隐藏元素（它始终存在），而[hidden]将添加或删除DOM中的元素。

从DOM中添加和删除内容通常很昂贵，但如果你一次或两次都这样做，那就无所谓了。我在我的项目中发现，使用哪种情况通常取决于情况的逻辑。