[Angular][Bootstrap] -Open and close Collapse effect with just one click

Question

I am wanting to perform a Collapse effect at the time I change item in the slider below. When I change the item, I receive from the service, various information recharging my child component (performed an ngFor). I would like to do the closing and opening effect on the item change. In the documentation of Bootsrap, I have to perform a click to close and another to open. It is possible with just one click (Changing the item in the slider) to perform the event of opening and closing the div being rendered ?

If you have another resource to perform the div movement by performing the loading effect in the slider navigation, please feel free.

I’m using the ng5-slider component https://www.npmjs.com/package/ng5-slider

"(valueChange)" - calls my service method within my.ts component for data return.

Thanks in advance for your attention.

HTML from my Slider

 <ng5-slider [(value)]="value"  (valueChange)="ServiceItem()" [options]="options"></ng5-slider>

Div that is rendered in change during slider navigation

  <div id="collapseExample">
    <div *ngFor="let itemLinhas of itens" class="card-block g-pa-0">
        <app-gridcoberturas [itensProdutos]="itemLinhas"></app-gridcoberturas>
    </div>    
  </div>         

Answer 1

I used a lib call ngx-bootstrap and used the Component Collapse for that reason.

ngx-bootstrap

The Input collapse is responsible for showing/hiding the elements. So I created a control variable for each Collapse.

  isColp3 = false;
  isColp4 = true

The basic structure of the component is like this

<div id="colp3" [collapse]="isColp3" class="card card-block card-header">
  <div class="well well-lg">Coisa aqui</div>
</div>

ng5-slider

With the Output valueChange i call my function that will change the collapses

Html code : (valueChange)="mudaCollapse()"

mudaCollapse() { 
    if( this.oldValue !== this.value){
      this.oldValue = this.value;
      this.isColp3 = !this.isColp3;
      this.isColp4 = !this.isColp4;
    }
  }

The condition if( this.oldValue !== this.value) is only to prevent the valueChange execute when clicking the button.

The complete code can be seen in this link