Bootstrap子菜单不能始终如一地工作

Question

我试图在侧边栏中包含两个子菜单。但是，我没有得到一致的下拉结果。在我10次加载/刷新的尝试中，子菜单下拉只能工作4/10次。有谁知道为什么会产生这样的结果？

控制台上也没有错误。

另外，我使用AngularJS将此侧边栏包含在我的主html代码中。

补充工具栏代码， sidebar.html

<div class="col-md-2"><!--grid 2 for bootstrap -->
        <div class="sidebar content-box" style="display: block;">
            <ul class="nav">
                <!-- Main menu -->
                <li class="current"><a href=""><i class="glyphicon glyphicon-home"></i> Dashboard</a></li>
                <br>
                <li><a href="calendar.html"><i class="glyphicon glyphicon-calendar"></i> Calendar</a></li>
               <br>
                <li><a href="forms.html"><i class="glyphicon glyphicon-stats"></i> Stats</a></li>
               <br>
                 <li class="submenu">
                     <a href="">
                        <i class="glyphicon glyphicon-list"></i> List
                        <span class="caret pull-right"></span>
                     </a>
                     <!-- Sub menu -->
                     <ul>
                        <li><a href="forms4.html">Sub Function 1</a></li>
                        <li><a href="forms5.html">Sub Function 2</a></li>
                        <li><a href="forms6.html">Sub Function 3</a></li>
                        <li><a href="forms7.html">Sub Function 4</a></li>
                    </ul>
                </li>
                     <br>

                <li class="submenu">
                     <a href="">
                        <i class="glyphicon glyphicon-list"></i> Function 5
                        <span class="caret pull-right"></span>
                     </a>
                     <!-- Sub menu -->
                     <ul>
                        <li><a href="forms1.html">Sub Function 5</a></li>
                        <li><a href="forms2.html">Sub Function 6</a></li>
                        <li><a href="forms3.html">Sub Function 7</a></li>
                    </ul>
                </li>
            </ul>
         </div>
      </div>

AngularJS部分加入侧边栏

<!--Include header-->
<div ng-include src="'views/templates/header.html'"></div>
<!--end of header-->
<div class="page-content">
    <div class="row">
    <!-- Insert Side bar-->
    <div ng-include src="'views/templates/sidebar.html'"></div>
    <div class="col-md-10"><!--Main content -->
        <div class="row">
        <!-- to display content here -->
        </div>
    </div>
 </div>
</div>

不确定出了什么问题。