如何在手风琴顶部制作下拉菜单

Question

我正在使用 ngx-accordion 模块来显示这样的

现在，当我点击详细信息下拉按钮时，视图是

手风琴根据下拉菜单调整其高度。但我希望下拉菜单位于手风琴顶部而不是内部。

Answer 1

我没有使用 ngx-bootstrap 但在一些类似的库中，您可以使用 appendToBody 选项来解决此类错误。

对于 ngx-bootstrap 你可以找到一个例子 here:

<div class="btn-group" dropdown container="body">
  <button id="button-container" dropdownToggle type="button" class="btn btn-primary dropdown-toggle"
          aria-controls="dropdown-container">
    Dropdown on Body <span class="caret"></span>
  </button>
  <ul id="dropdown-container" *dropdownMenu class="dropdown-menu"
      role="menu" aria-labelledby="button-container">
    <li role="menuitem"><a class="dropdown-item" href="#">Action</a></li>
    <li role="menuitem"><a class="dropdown-item" href="#">Another action</a></li>
    <li role="menuitem"><a class="dropdown-item" href="#">Something else here</a></li>
    <li class="divider dropdown-divider"></li>
    <li role="menuitem"><a class="dropdown-item" href="#">Separated link</a>
    </li>
  </ul>
</div>

关键部分是将 container="body" 添加到您的下拉列表中。

如何在手风琴顶部制作下拉菜单

How to make dropdown on top of accordion

twitter-bootstrap

ngx-bootstrap

angular