Collapse

Demo

Example

Module
  
    
      
        import { NgModule } from '@angular/core';
        
    
      
        import { CollapseComponent } from './collapse.component';
        
    
      
        
        
    
      
        @NgModule({
        
    
      
          declarations: [CollapseComponent],
        
    
      
        })
        
    
      
        export class CollapseModule { }
        
    
Component HTML
  
    
      
        <button (click)="collapseVisible = !collapseVisible">Expand/collapse</button>
        
    
      
        <div class="overflow-hidden" *ngIf="collapseVisible" [@slideUpDownNgif]>
        
    
      
          Content
        
    
      
        </div>
        
    
Component Typescript
  
    
      
        import { Component } from '@angular/core';
        
    
      
        import { SlideUpDownNgifAnimation } from '@mintplayer/ng-animations';
        
    
      
        
        
    
      
        @Component({
        
    
      
          selector: '...',
        
    
      
          templateUrl: '...',
        
    
      
          styleUrls: [...],
        
    
      
          animations: [SlideUpDownNgifAnimation]
        
    
      
        })
        
    
      
        export class CollapseComponent {
        
    
      
          collapseVisible = false;
        
    
      
        }