如何在没有标志的情况下使用 ngx-bootstrap angular 进行折叠

Question

我正在尝试做一个折叠动画，但是没有布尔指示器 isCollapsed，因为我有很多元素，我不想做很多布尔值，有一种方法可以在没有布尔指标的情况下做到这一点？

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

组件：

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

谢谢！

这个例子来自文档https://valor-software.com/ngx-bootstrap/#/collapse#examples

Answer 1

您可以有很多折叠组件。

<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

如何在没有标志的情况下使用 ngx-bootstrap angular 进行折叠

how to collapse with ngx-bootstrap angular without a flag

angular

typescript

ngx-bootstrap