how to collapse with ngx-bootstrap angular without a flag

问题

i am trying to do a collapse animation, but without the boolean indicator isCollapsed, because i have a lot of elements and i don´t want to make a lot of booleans, there is a way to do that without a boolean indicator?

<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>

component:

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

Thank you!

This example is from the doc https://valor-software.com/ngx-bootstrap/#/collapse#examples

回答1:

You can have lots of collapse components.

<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

来源：https://stackoverflow.com/questions/63036186/how-to-collapse-with-ngx-bootstrap-angular-without-a-flag