css - Angular Bootstrap 下拉元素以在左侧打开

Question

我正在使用 ngbDropdown .默认情况下，下拉元素显示在右侧。如果下拉对齐在页面的大部分右侧，则该元素将变得不可见。

这是HTML

<div ngbDropdown class="d-inline-block float_right">
   <span id="dropdownBasic1" ngbDropdownToggle class="cursor-pointer">Sort by</span>
   <div ngbDropdownMenu aria-labelledby="dropdownBasic1">
      <button class="dropdown-item">Name</button>
      <button class="dropdown-item">Date of creation</button>
   </div>
</div>

我试过上课 dropdown-menu-left但它没有用。如何对齐下拉元素以显示在左侧，以便文本不会中断？

Answer 1

我通过放置 placement="bottom-right" 解决了它在主分区中。
更新的 html 是

<div ngbDropdown class="d-inline-block float_right" placement="bottom-right">
   <span id="dropdownBasic1" ngbDropdownToggle class="cursor-pointer">Sort by</span>
   <div ngbDropdownMenu aria-labelledby="dropdownBasic1">
      <button class="dropdown-item">Name</button>
      <button class="dropdown-item">Date of creation</button>
   </div>
</div>