[英]ngx-bootstrap dropdown not opening angular 4 bootstrap 4
我无法弄清楚这里发生了什么 - 我已经包含了我认为基于文档是正确的 ngx-dropdown 代码:
主页.component.html
<div class="btn-group" dropdown>
<button dropdownToggle type="button" class="btn btn-primary dropdown-toggle">
Button dropdown <span class="caret"></span>
</button>
<ul *dropdownMenu class="dropdown-menu" role="menu">
<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>
app.module.ts
@NgModule({
imports: [
BsDropdownModule.forRoot(),
...
]
site.module.ts (这是包含 home 组件的模块)
@NgModule({
imports: [
BsDropdownModule,
我正在使用 angular-cli 并且包含了引导程序样式:
"../node_modules/bootstrap/dist/css/bootstrap.min.css",
在index.html 中,我添加了一个片段,让浏览器知道我正在使用引导程序 4:
<script>window.__theme = 'bs4';</script>
<app-root>Loading . . .</app-root>
按钮出现,控制台中没有显示错误。 单击按钮时,我可以看到 dom 发生变化(“打开”和“显示”正在添加到样式中)。 但是按钮下方的任何内容都没有打开 - 没有显示菜单。
我不知道还能去哪里看
我有同样的问题。 在我从 '@angular/platform-browser/animations' 导入 `import { BrowserAnimationsModule } 之后; 到 app.module.ts 并将 BrowserAnimationsModule 添加到导入:[] 问题解决。 使用一些不必要的代码,您的 app.module.ts 应该如下所示。 我目前正在使用 Angular 9.0:
import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
...
@NgModule({
...
},
imports:[
BrowserAnimationsModule,
BsDropdownModule.forRoot()
],
....
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.