Javascript AngularJS和引导不使用下拉菜单

所以，我的问题是为什么我的下拉列表不能用于导航栏。当所有HTML都在一个文档中时，它可以工作，但当我使用ng include时，它不能工作。我使用的不是引导而是MetrouiCSS

index.html

部分/header.html

---

所以，基本上，当我点击博客时，它不会从菜单上掉下来

Bootstrap仅在DOM准备就绪事件时才对其求值，因此，如果此时存在下拉列表，它将工作，否则，如果稍后使用ng include（例如）将其添加到DOM中，它将不会工作

幕后ng include为您操作DOM，并执行AJAX请求以检索要包含的HTML。bootstrap没有意识到这一点，不会等待DOM更新

---

为了避免使用

Hm，我认为这有帮助，但我认为这与我的header.html部分有关。当然，这就是我所说的。这不是文件的内容，而是如何加载它。无论如何，bootstrap js不是为与AngularJS.Ya一起工作而设计的，我想这里告诉了我如何修复它：与其编写这个补丁，为什么不使用一个旨在集成AngularJS和bootstrap的库呢？它是用纯AngularJS编写的，不需要jQuery，但仍然可以使用相同的CSS，因此您不必更改布局。请看这里的示例：我认为这是一个更好的解决方案。我尝试通过引导程序告诉我的方式添加引导程序，但仍然不起作用。对于DOM元素上的操作，AngularJS使用指令。要了解其中的区别，请看下面这个伟大的答案：

<div id="container">
    <div id="header" ng-include="'app/templates/header.html'"></div><!-- End header container -->
</div>

<div id="site_nav_bar">
    <nav class="navigation-bar dark fixed-top shadow">
        <nav class="navigation-bar-content">
            <item class="element"><i class="icon-keyboard" style="padding-right: 1em"></i> <a href="index.html">Home</a></item>
            <item class="element-divider"></item>
            <item class="element"><a href="#/about.html">About</a></item>
            <item class="element"><a href="#/contact.html">Contact</a></item>

            <ul class="element-menu">
                <li>
                    <a class="dropdown-toggle" href="#">Blogs</a>
                    <ul class="dropdown-menu" data-role="dropdown">
                        <li>
                            <a href="#" class="dropdown-toggle">Programming Blogs</a>
...
                        </li>