What is the difference between *ngIf and [hidden]?

Question

Say I check it against and expression, then aren\'t these two same ?

{{val}}
         


        

Answer 1

ngIf is a structural directive, it creates/destroys content inside the DOM. The second statement just hides/shows the content with css, i.e. adding/removing display:none to the element's style.

What are structural directives?

Structural directives are responsible for HTML layout. They shape or reshape the DOM's structure, typically by adding, removing, or manipulating elements.

---

In the first case if expression is false then div and it's content won't be created. In the second case div and content are always created but they are not visible if the expression is false.