Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/36.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 一个引导下拉菜单有效,另一个不在同一页面上_Javascript_Css_Angularjs_Twitter Bootstrap_Angular Ui Bootstrap - Fatal编程技术网

Javascript 一个引导下拉菜单有效,另一个不在同一页面上

Javascript 一个引导下拉菜单有效,另一个不在同一页面上,javascript,css,angularjs,twitter-bootstrap,angular-ui-bootstrap,Javascript,Css,Angularjs,Twitter Bootstrap,Angular Ui Bootstrap,我有一个导航栏,里面有两个下拉元素,由BootstrapUI控制 奇怪的是,一个在工作,另一个没有。这段代码来自mean.js样板文件,因此熟悉它的人都知道自己的方法。我怀疑这和引导javascript文件的顺序有关。这是我点的菜: <script type="text/javascript" src="lib/jquery/dist/jquery.js"></script> <script type="text/javascript" src="lib/boots

我有一个导航栏,里面有两个下拉元素,由BootstrapUI控制

奇怪的是,一个在工作,另一个没有。这段代码来自mean.js样板文件,因此熟悉它的人都知道自己的方法。我怀疑这和引导javascript文件的顺序有关。这是我点的菜:

<script type="text/javascript" src="lib/jquery/dist/jquery.js"></script>
<script type="text/javascript" src="lib/bootstrap/dist/js/bootstrap.js"></script><script type="text/javascript" src="lib/angular/angular.js"></script>
<script type="text/javascript" src="lib/angular-ui-router/release/angular-ui-router.js"></script>
<script type="text/javascript" src="lib/angular-animate/angular-animate.js"></script>
<script type="text/javascript" src="lib/angular-bootstrap/ui-bootstrap.js"></script>
<script type="text/javascript" src="lib/angular-bootstrap/ui-bootstrap-tpls.js"></script><script type="text/javascript" src="lib/angular-resource/angular-resource.js"></script>
<script type="text/javascript" src="lib/angular-cookies/angular-cookies.js"></script>
<script type="text/javascript" src="lib/angular-touch/angular-touch.js"></script><script type="text/javascript" src="lib/angular-sanitize/angular-sanitize.js"></script>
<script type="text/javascript" src="lib/angular-ui-utils/ui-utils.js"></script><script type="text/javascript" src="lib/angular-ui-bootstrap-datetimepicker/datetimepicker.js"></script>

这是令人不快的代码

 //This guy isn't working at all!!
    <nav class="collapse navbar-collapse" collapse="!isCollapsed" role="navigation">
        <ul class="nav navbar-nav" data-ng-if="menu.shouldRender(authentication.user);">
            <li data-ng-repeat="item in menu.items | orderBy: 'position'" data-ng-if="item.shouldRender(authentication.user);" ng-switch="item.menuItemType" ui-route="{{item.uiRoute}}" class="{{item.menuItemClass}}" ng-class="{active: ($uiRoute)}" dropdown="item.menuItemType === 'dropdown'">
                <a ng-switch-when="dropdown" class="dropdown-toggle">
                    <span data-ng-bind="item.title"></span>
                    <b class="caret"></b>
                </a>
                <ul ng-switch-when="dropdown" class="dropdown-menu">
                    <li data-ng-repeat="subitem in item.items | orderBy: 'position'" data-ng-if="subitem.shouldRender(authentication.user);" ui-route="{{subitem.uiRoute}}" ng-class="{active: $uiRoute}">
                        <a href="/#!/{{subitem.link}}" data-ng-bind="subitem.title"></a>
                    </li>
                </ul>
                <a ng-switch-default href="/#!/{{item.link}}" data-ng-bind="item.title"></a>
            </li>
        </ul>

       //This guy is working no problem
        <ul class="nav navbar-nav navbar-right" data-ng-show="authentication.user">
            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                    <span data-ng-bind="authentication.user.displayName"></span> <b class="caret"></b>
                </a>
                <ul class="dropdown-menu">
                    <li>
                        <a href="/#!/settings/profile">Edit Profile</a>
                    </li>
                    <li>
                        <a href="/#!/settings/accounts">Manage Social Accounts</a>
                    </li>
                    <li data-ng-show="authentication.user.provider === 'local'">
                        <a href="/#!/settings/password">Change Password</a>
                    </li>
                    <li class="divider"></li>
                    <li>
                        <a href="/auth/signout">Signout</a>
                    </li>
                </ul>
            </li>
        </ul>
    </nav>
//这家伙根本不工作!!
数据ng if=“menu.shouldRender(authentication.user);”>
  • //这家伙在工作没问题
    有人知道这是怎么回事吗


    我正在使用BootstapUIV0.12.1,以防这会产生影响。

    您正在加载“竞争性”库。首先,Angular UI引导库旨在取代引导javascript实现(请参见哲学部分),因此请删除:

    <script type="text/javascript" src="lib/bootstrap/dist/js/bootstrap.js"></script>
    
    <script type="text/javascript" src="lib/angular-bootstrap/ui-bootstrap.js"></script>
    
    
    
    其次,有两个Angular UI引导包,一个包含指令模板,另一个没有(详细说明),因此请删除:

    <script type="text/javascript" src="lib/bootstrap/dist/js/bootstrap.js"></script>
    
    <script type="text/javascript" src="lib/angular-bootstrap/ui-bootstrap.js"></script>
    
    
    

    最可能发生的情况是,这3个库都为下拉列表附加了自己的关闭/打开处理程序,并且它们正在相互争斗。

    Hi,在另一篇文章中,有一个版本问题导致了问题。尝试使用0.12.0版本。看看这是否有帮助。