web-dev-qa-db-fra.com

Afficher Masquer une div en angular 7

J'essaie d'afficher/masquer un div dans angular 7 en utilisant ng-model et ng-hide mais cela ne fonctionne pas.

button pour afficher/masquer - utilisé ng-model pour définir l'expression

    <button type="checkbox" ng-model="show" >show/hide</button>

div pour afficher/masquer, utilisé ng-hide pour masquer le div

<div class="row container-fluid" ng-hide="show" id="divshow" >
  Div Content
</div>    
</body>
</html>

J'ai essayé ng-model et ng-hide ça ne marche toujours pas. Veuillez fournir une solution

5
Ayush Jain AJ

Vous pouvez utiliser le gestionnaire d'événements change si vous utilisez type='checkbox'

<input type="checkbox" (change)="show = !show" ng-model="show" />
Div to Show/Hide

<div class="row container-fluid" *ngIf="show" id="divshow" >
Div Content
</div>

Démo Stackblitz

1
Abhishek Kumar

vous devez utiliser un indicateur Dans votre fichier ts, Par défaut indicateur faux

<button type="checkbox" (click)="flag= !flag">{{falg=== true ? 'Show' : 'Hide'}}</button>
0
X3Vikas