Angular2:条件显示,绑定到[hidden]属性与*ngIf指令

Question

在Angular2中,假设我想要有条件地显示一个<div>块.以下两种方式有什么区别.

1. <div [hidden]=isLoaded>Hello World!</div>where isLoaded是相应.ts文件中的布尔值.

2. <div *ngIf=isLoaded>Hello World!</div>

我知道即使<div>页面中没有显示,1.仍然有<div>DOM中的内容,而不是.还有其他差异吗？他们每个人的利弊是什么？

Answer 1

区别在于*ngIf将从DOM中删除元素,而[hidden]实际通过设置播放CSS样式display:none.然而,问题[hidden]是它可能是overiden所以div,因为在你的情况下,将显示,你会抓住你的头,为什么它不起作用.

综上所述事情,*ngIf和[hidden]是不一样的.前者从DOM中删除元素,而后者则切换displayCSS属性.