文库 / 技术

NGX-Bootstrap 导航栏下拉菜单不起作用

分享于2023年03月15日 angular ngx-bootstrap twitter-bootstrap 问答
【问题标题】：NGX-Bootstrap Navbar dropdown not workingNGX-Bootstrap 导航栏下拉菜单不起作用
【发布时间】：2023-03-14 14:00:05
【问题描述】：

所以我试图在我的导航栏中添加一个下拉菜单。我修改了 ngx-bootstrap 上的下拉示例以匹配引导导航栏示例中的下拉示例，但它仍然无法正常工作。当我单击下拉菜单时，它不仅显示下拉项目，而且还扩展了整个导航栏，如下所示。

导航栏.html

软件：

  • 最新角度
  • 引导程序 4
  • Ngx 引导


【解决方案1】：

这可能是由于对下拉菜单应用了一些其他样式。但是如果你想在不弄清楚根本问题的情况下修复它，你可以尝试 

  •

    • 这会将下拉列表添加到您的 html 的根目录，而不是在它定义的位置。这样就不太可能影响您的页面布局。

    然而，我建议使用浏览器元素检查器，看看究竟是什么应用于您的下拉样式样式。

    【讨论】：

    • 该行实际上破坏了我的浏览器。当我单击下拉链接时，整个网站变得无响应。
    • @Ponzi314 很有趣。您能否查看官方文档，是否使用 `container="body" 也会对您无响应。 valor-software.com/ngx-bootstrap/#/dropdowns#container 如果不是，它可能与您的其他一些本地代码有关。
    推荐
    标签
    • string(21)
    • logstash(20)
    • django(23)
    • selenium(29)
    • electron-forge(19)
    • dataframe(27)
    • vuetify.js(26)
    • nuxt.js(29)
    • kibana(34)
    • ionic-framework(29)
    • .net-core(25)
    • unity3d(27)
    • jwt(17)
    • sass(24)
    • reactjs(239)
    • mysql(433)
    • matplotlib(16)
    • elastic-stack(26)
    • discord.js(21)
    • async-await(21)
    • struct(16)
    • nestjs(18)
    • kubernetes(22)
    • laravel(125)
    • rest(16)
    • angular(431)
    • regex(21)
    • wordpress(41)
    • list(16)
    • mongodb(69)
    • macos(32)
    • firebase(32)
    • graphql(18)
    • c#(343)
    • python(514)
    • elasticsearch(342)
    • web-scraping(17)
    • next.js(26)
    • spring-data-elasticsearch(19)
    • angular-material(29)
    • node-modules(17)
    • electron(306)
    • visual-studio(26)
    • visual-studio-code(44)
    • flask(17)
    • c++(154)
    • npm(71)
    • go(392)
    • go-gorm(18)
    • axios(39)
    • jquery(44)
    • vuejs3(60)
    • 问答(4488)
    • php(457)
    • woocommerce(19)
    • jestjs(35)
    • symfony(18)
    • android(19)
    • postgresql(40)
    • node.js(640)
    • numpy(25)
    • ajax(24)
    • express(84)
    • c(85)
    • vuejs2(39)
    • rxjs(34)
    • database(69)
    • sorting(18)
    • pandas(68)
    • api(47)
    • typescript(269)
    • css(107)
    • docker(46)
    • windows(23)
    • html(213)
    • .net-6.0(22)
    • asp.net-core(42)
    • json(77)
    • spring-boot(39)
    • azure(23)
    • selenium-webdriver(17)
    • electron-builder(46)
    • mongoose(33)
    • asp.net(40)
    • webpack(36)
    • vue.js(374)
    • arrays(81)
    • sql(141)
    • unit-testing(34)
    • python-3.x(52)
    • .net(72)
    • javascript(961)
    • linux(31)
    • vite(19)
    • amazon-web-services(37)
    • redis(21)
    • laravel-8(16)
    • react-native(20)
    • date(17)
    • java(89)
    在线工具