typescript - hur man kollapsar med ngx-bootstrap angular utan en flagga

Jag försöker göra en kollaps-animation, men utan det booleska indikatorsvärdet isCollapsed, eftersom jag har många element och jag vill inte skapa många booleans. Finns det ett sätt att göra det utan ett booleskt indikatorvärde?

<button type="button" class="btn btn-primary" (click)="isCollapsed = !isCollapsed"
        [attr.aria-expanded]="!isCollapsed" aria-controls="collapseBasic">Toggle collapse
</button>
<hr>
<div id="collapseBasic" [collapse]="isCollapsed">
  <div class="well well-lg card card-block card-header">Some content</div>
</div>

komponent :

import { Component } from '@angular/core';
 
@Component({
  selector: 'collapse-demo',
  templateUrl: './basic.html'
})
export class CollapseDemoComponent {
  isCollapsed = false;
}

Tack!

Detta exempel är från dokumentationen https://valor-software.com/ngx-bootstrap/#/collapse#examples

Svar #1

Du kan ha många kollapskomponenter.

<collapse-demo-animation content="content a"></collapse-demo-animation>
<collapse-demo-animation content="content b"></collapse-demo-animation>
<collapse-demo-animation content="content c"></collapse-demo-animation>
<collapse-demo-animation content="content d"></collapse-demo-animation>
<collapse-demo-animation content="content e"></collapse-demo-animation>
<collapse-demo-animation content="content f"></collapse-demo-animation>

https://stackblitz.com/edit/angular-ryym9l-uvya9e