web-dev-qa-db-fra.com

visibilité: caché dans Angular 2

Quelle est la méthode suggérée pour obtenir l’invisibilité de l’élément dans l’angle 2 (visibility:hidden ne montrant pas l’élément mais le garde occupé par un espace)? Il a une directive [hide] mais il semble être similaire à un display:none

16
jesantana

Vous pouvez définir l'attribut de style visibility avec style binding :

<div [style.visibility]="'hidden'"></div>
<div [style.visibility]="isDivVisible ? 'visible' : 'hidden'"></div>

Un exemple est montré dans this plunker .

44
ConnorsFan

Vous pouvez également utiliser la possibilité d'angular d'inspecter dynamiquement votre propriété et d'actualiser DOM avec NgStyle:

<div [ngStyle]="{'visibility':isDivVisible ? 'visible' : 'hidden'}"></div>

4
Lanou

Vous pouvez faire ngIf si vous ne voulez pas que votre composant soit rendu dans le DOM.

Si vous voulez que ce composant soit rendu mais ne soit pas affiché, vous pouvez simplement définir l’affichage sur none en fonction d’une condition avec NgClass. Mais sachez que cela peut conduire à un comportement buggy, essayez toujours d’utiliser ngIf.

0
Eduardo Vargas