首页 > 解决方案 > 使用 ng-bootstrap 一次展开一项

问题描述

非常感谢提供的帮助。前面的问题虽然解决了,但是压一个类,比如实体管理,就会把实体管理和人员管理都解开。

当我按下一个类别时,我不想展开所有类别。当我按下一个类别时折叠所有类别很好,但反之则不行。

有关解决此错误的任何想法?

    </ul><span class="heading">Settings</span>
    <ul class="list-unstyled">
      <li> <a (click)="isCollapsed=!isCollapsed" aria-controls="collapseExample"><i class="icon-interface-windows"></i>Staff Management</a></li>
      <div id="collapseExample" [ngbCollapse]="isCollapsed">
        <li><a routerLink="/staff">&nbsp; &nbsp; &nbsp; &nbsp; Access Rights</a></li>
        <li><a routerLink="/staff">&nbsp; &nbsp; &nbsp; &nbsp; Staff Details</a></li>
      </div>
      <li> <a (click)="isCollapsed=!isCollapsed" aria-controls="collapseExample"><i class="icon-interface-windows"></i>Entity Management</a></li>
      <div id="collapseExample" [ngbCollapse]="isCollapsed">
        <li><a routerLink="/company">&nbsp; &nbsp; &nbsp; &nbsp; Company</a></li>
      </div>
    </ul>

Prev post:默认情况下折叠所有项目 ng-bootstrap

标签: bootstrap-4ng-bootstrap

解决方案


发现我的错误

只需在 ts 添加另一个变量

isCollapsedStaff = true;

然后用更新后的变量更新 html 文件

 <li> <a (click)="isCollapsedStaff=!isCollapsedStaff" aria-controls="collapseExample1"><i class="icon-interface-windows"></i>Staff Management</a></li>
          <div id="collapseExample" [ngbCollapse]="isCollapsedStaff">

推荐阅读