div中[hidden]与使用ng-show有什么区别？

Question

我正在经历the Angular 2 documentation并找到以下内容：

<div [hidden]="name.valid || name.pristine"
 class="alert alert-danger">

[hidden]部分没有解释。它是HTML属性，CSS还是Angular？为什么不使用ng-show？

Answer 1

ng-show是angular1的历史。在没有hidden属性（标准HTML，它可用starting from ie11）之前，所有标准属性都被一些类似的角度指令所覆盖，这些指令正在做这些事情。

这是一个问题，因为它迫使角度程序员学习很多指令。

Angular2的想法是删除所有不必要的指令，ng-show就是其中之一。相反，angular2引入了一个绑定[hidden]的属性，它执行相同的工作。

所以答案是：这是angular2属性绑定使用的标准HTML属性。

Answer 2

hidden是a global HTML attribute。方括号表示property binding。因此

[hidden]="name.valid || name.pristine"

表示“如果指定的控件有效或原始”，则将隐藏属性应用于此元素。然后，浏览器将使用display: none呈现它。

您也可以使用*ngIf完全从渲染的DOM中删除元素，例如， this answer进行比较。

目前还不清楚为什么你引用ng-show，它是Angular 1的一部分而在2中不再存在。