单击行时 Ngb-accordion 展开

Question

我正在尝试为 ng-bootstrap 中的 ng-accordion 找到解决方案。

Accordin - 是否有可能单击行中的任何位置并展开/折叠它？不仅在标签上...

<ngb-accordion #acc="ngbAccordion" activeIds="ngb-panel-0">
  <ngb-panel title="Simple" >
    <ng-template ngbPanelContent>
        Test text
    </ng-template>
  </ngb-panel>
</ngb-accordion>

Answer 1

使用自定义 css 应该很容易，例如：

组件.css

ngb-accordion ::ng-deep .card-header {
    padding: 0;
}

ngb-accordion ::ng-deep .card-header button {
  width: 100%;
  padding: 1.125rem 2rem;
  text-decoration: none;
  text-align: left;

}
ngb-accordion ::ng-deep .card-header button:focus {
  box-shadow: none;
}

堆栈闪电战示例