0

したがって、私の質問は、ドロップダウンがナビゲーションバーで機能しない理由を扱っています。すべての HTML が 1 つのドキュメントにある場合は機能しますが、ng-include を使用している場合は機能しません。Bootstrap ではなく MetroUI-CSS を使用しています。

index.html

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

部分/header.html

<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>

基本的に、ブログをクリックしてもメニューがドロップダウンしません。

4

1 に答える 1

0

Bootstrap は、DOM の準備が整ったとき (ready イベント) にのみ DOM を評価します。したがって、この時点でドロップダウンが存在する場合は機能します。

バックグラウンドで ng-include が DOM を操作し、AJAX リクエストを実行して、含める HTML を取得します。ブートストラップはそれを認識しておらず、DOM が更新されるのを待ちません。

それを避けるには、bootstrap-uiを使用します

于 2014-10-29T20:30:38.157 に答える