javascript - 使用 ng-Router Bootstrap 导航栏不会折叠

Question

我的 Angular 项目已完成并且工作正常。我遇到的问题是，在实现 ng-route 导航后我的引导导航栏将打开但不会折叠。我在堆栈溢出上检查了类似的解决方案并尝试了很多，但它们不起作用。任何帮助将不胜感激。

--- HTML code ---

    <nav class="navbar navbar-inverse navbar-static-top">
        <div class="container-fluid">
            <div class="navbar-header">
                <a class="navbar-brand navbar-link" href="#/">Big Blue</a>
                <button class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navcol-1">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
            </div>
            <div class="collapse navbar-collapse" id="navcol-1">
                <ul class="nav navbar-nav navbar-right">
                    <li class="active" role="presentation"><a href="#/">Home </a></li>
                    <li role="presentation"><a href="#overview">Overview </a></li>
                    <li role="presentation"><a href="#map">Map </a></li>
                </ul>
            </div>
        </div>
    </nav>

------ app.js code -------
var app = angular.module("bigBlue", ["ngRoute"]); /* New module called big blue */


app.config(function($routeProvider) {
    $routeProvider
    .when('/', {
        template: '<div main-slide-show></div>' // I moved my slideshow directive into the context of the index 
    })                                          // instead of the context of the entire application.
    .when('/overview', {                        // pulling the slideshow directive out of the markup
        templateUrl : 'overview.html',
        controller : 'whaleController'
    })
     .when('/map', {
        templateUrl : 'map.html',
        controller : 'MapController',
    })

    .otherwise({
        redirectTo : '/'
    });
});

Answer 1

通常折叠/显示通常是一个样式问题。因此请务必检查该元素并查看该类是否应用于该元素以及该类是否应用了样式。

在某些情况下，现有类可能会被其他自定义样式覆盖。因此请删除所有自定义 CSS 并仅加载 Angular CSS。