Angular 2 - ngShow equivalent? - Doskonała biblioteka

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:Angular 2 - ngShow equivalent?

W /app/app.component.ts
```
newTrustFormVisible: false; 
```

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?

Źródło

2017-02-14 Max Griffin

Próbowałem również 'newTrustFormVisible: Boolean = false;' co moim zdaniem jest rzeczywiście poprawna składnia dla tej linii, chociaż nie miało to znaczenia dla r esult. –

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.

lub

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

Angular 1 to Angular 2 reference

*ngIf

Źródło

2017-02-14 01:18:50 shusson

To działa, dziękuję, ale to nie jest animowane, jak przykład w dokumentacji (masz rację, wydaje się być dla AngularJS 1.x)? –

Animacje są oddzielnym czajnikiem dla ryb zobacz https://angular.io/docs/ts/latest/guide/animations.html – shusson

Więc gdzie ng-show animowałoby się automatycznie, najbliższe odpowiedniki w Angular 2 tego nie robią. Wydaje się dziwne? Przełączyłem się na ngClass, ponieważ jest to łatwiejsze do animacji, chociaż nie mam jeszcze animacji do działania. Będę dalej grać. –

Angular 2 - ngShow equivalent?

Odpowiedz

Powiązane problemy