如何使Twitter Bootstrap Dropdown在列表项下工作

Question

我有一个结构 -

.navbar-collapse.collapse.pull-right
            ul.nav.navbar-nav
                li.active
                    a(href="/") Home
                li
                    a About
                li
                    a Contact
                li
                    div(ng-include="'/partials/account/navbar-login'",ng-controller="navBarLoginController")

navbar-login部分文件的内容为 -

form.navbar-form(ng-hide="identity.isAuthenticated()")
    .form-group.login
        input.form-control(placeholder="Email", ng-model="username")
    .form-group.login
        input.form-control(placeholder="Password",type="password",ng-model="password")
    button.btn.btn-primary.login(ng-click="signin(username,password)") Login
ul.nav.navbar-nav.navbar-right(ng-show="identity.isAuthenticated()")
    li.dropdown
        a.dropdown-toggle(href="", data-toggle="dropdown")
            | {{identity.currentUser.firstName + " " + identity.currentUser.lastName}}
            b.caret
        ul.dropdown-menu
            li
                a(href="", ng-click="signout()") Sign Out

现在当我尝试在包含bootstrap.js，dropdown.js，bootstrap.css之后运行它时，我的下拉框不起作用。我猜是因为它位于标题中的列表元素内。那么，我该如何改进呢？