Angular 2 - ngShow equivalent?

Question

Zgodnie z moją interpretacją dokumentacji, jeśli chcę mieć element ukryty domyślnie i pokazywany po kliknięciu łącza, powinny działać następujące elementy:

1. W /app/app.component.ts

   newTrustFormVisible: false; 
   

2. W /app/app.component.html

   <a href="#" (click)="newTrustFormVisible = !newTrustFormVisible;">[Add New]</a> 
   
   <div ng-show="newTrustFormVisible" class="panel panel-default"> 
       ... 
   </div> 
   

Jednak to nie działa. Nie powoduje również błędów. czego mi brakuje?

Answer 1

Twoje zastosowanie dyrektyw Angular 1. W przypadku Angular 2 użyj *ngIf dla komponentów, które nie muszą znajdować się w DOM, gdy są ukryte lub wiążą się z ukrytą właściwością HTML [hidden], jeśli chcesz, aby komponent był zawsze w DOM, ale ukryty za pomocą CSS.

np

lub

<div [hidden]="!newTrustFormVisible" class="panel panel-default"> 

Angular 1 to Angular 2 reference

*ngIf