Question

单击站点导航菜单项时，它将返回主本地主机。

部分也不加载。我究竟做错了什么？

        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">

        <title></title>

        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <link rel="apple-touch-icon" href="apple-touch-icon.png">
        <!-- Place favicon.ico in the root directory -->

        <link rel="stylesheet" href="css/main.css">
        <!-- Latest compiled and minified CSS -->
        <script src="js/vendor/modernizr-2.8.3.min.js"></script>
          <base href="/">
    </head>
    <body>
        <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->

        <!-- Add your site or application content here -->
         <section id="sidebar" class="animated slideInLeft" ng-controller="menuCtrl">

            <a href="#/" class="logo">

               <object type="image/svg+xml" data="img/logo.svg" width="70" style="margin-left: 11px;"></object>
                <h1>devncode</h1>
            </a>

            <ul class="site-nav">
                <li ng-class="menuClass('home')" ><a href="/" class="hvr-underline-from-left">›&nbsp;&nbsp;Home</a></li>
                <li ng-class="menuClass('about')" ><a href="/about">›&nbsp;&nbsp;About Me</a></li>
                <li ng-class="menuClass('portfolio')" ><a href="/portfolio" class="hvr-underline-from-left">›&nbsp;&nbsp;Portfolio</a></li>
                <li ng-class="menuClass('resume')" ><a href="/resume" class="hvr-underline-from-left">›&nbsp;&nbsp;Resume</a></li>
                <li ng-class="menuClass('contact')" ><a href="/contact" class="hvr-underline-from-left">›&nbsp;&nbsp;Contact</a></li>
            </ul>


            <ul class="social">
                <li>
                    <a href="">
                        <object type="image/svg+xml" data="img/github.svg" width="30" ></object>
                    </a>
                </li>
                <li>
                    <a href="">
                        <object type="image/svg+xml" data="img/linkedin.svg" width="30" ></object>
                    </a>
                </li>
            </ul>    
        </section>


        <div ng-view="" id="container">

        </div>


        <script src="js/vendor/angular.min.js"></script>
        <script src="js/vendor/jquery-1.11.2.min.js"></script>
        <script src="js/vendor/velocity.min.js"></script>
        <script src="js/vendor/nprogress.js"></script>
         <script src="js/app.js"></script>
        <script src="js/controllers/homecontroller.js"></script>
        <script src="js/controllers/aboutcontroller.js"></script>
        <script src="js/controllers/portfoliocontroller.js"></script>
        <script src="js/controllers/menucontroller.js"></script>
        <script src="js/controllers/loadercontroller.js"></script>


    </body>
</html>


//Define an angular module for our app
angular.module('devncode', [])
app.config(function($routeProvider, $locationProvider) {


    $routeProvider
        .when('/', {
            templateUrl : 'partials/index.html',
            controller : 'homeController'
        })
        .when('/about', {
            templateUrl : 'partials/about.html',
            controller : 'aboutController'
        })
        .when('/portfolio', {
            templateUrl : 'partials/portfolio.html',
            controller : 'portfolioController'
        })
        .when('/resume', {
            templateUrl : 'partials/resume.html',
            controller : 'loaderController'
        })
        .when('/contact', {
            templateUrl : 'partials/contact.html',
            controller : 'loaderController'
        })
        .otherwise({
          redirectTo: '/home'
        });
        $locationProvider.html5Mode({
          enabled: true,
          requireBase: false
        });

});

Answer 1

您的网站导航菜单按钮首先不应在href属性中指定任何链接，因为您在此处将其称为href="#/"，它将应用程序重定向到主页。你的href应该是空白的

<强> HTML

<a href="" class="logo">
    <object type="image/svg+xml" data="img/logo.svg" width="70" style="margin-left: 11px;"></object>
    <h1>devncode</h1>
</a>

您的导航按钮应该有效，因为您提出了问题网址http://localhost:8888/devncode/这是完全错误的，因为您在$routeProvider注册了路由（/devncode）时应该是{{1 }＆amp;另一个是http://localhost:8888/devncode

希望这可以帮到你，谢谢

Angular JS，路由使用漂亮的URL不起作用

1 个答案: