Bootstrap按钮下拉不起作用

时间:2017-11-30 19:05:46

标签: twitter-bootstrap angular ngx-bootstrap

我无法通过ngx-bootstrap在我的Angular 4应用中使用Bootstrap v3按钮下拉菜单。

Bootstrap v3文档示例在我的组件中不起作用。 https://getbootstrap.com/docs/3.3/components/#btn-dropdowns

<!-- Single button -->
<div class="btn-group">
  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Action <span class="caret"></span>
  </button>
  <ul class="dropdown-menu">
    <li><a href="#">Action</a></li>
    <li><a href="#">Another action</a></li>
    <li><a href="#">Something else here</a></li>
    <li role="separator" class="divider"></li>
    <li><a href="#">Separated link</a></li>
  </ul>
</div>

我的模块从ngx-bootstrap ...

导入这些模块
import {AccordionModule, BsDropdownModule, CollapseModule, ModalModule, ProgressbarModule, TooltipModule} from 'ngx-bootstrap';

@NgModule({
  imports: [
    // Bootstrap Modules
    AccordionModule.forRoot(),
    BsDropdownModule.forRoot(),
    CollapseModule.forRoot(),
    ModalModule.forRoot(),
    ProgressbarModule.forRoot(),
    TooltipModule.forRoot(),
]
})

1 个答案:

答案 0 :(得分:3)

我想通了......我没有看ngx-bootstrap的下拉文档,只是查看了按钮文档。

以下是按钮下拉说明的链接。 https://valor-software.com/ngx-bootstrap/#/dropdowns