Angular JS路由不起作用，控制台中没有错误答案

【问题标题】：Angular JS routing not working and there is no error in consoleAngular JS路由不起作用，控制台中没有错误
【发布时间】：2017-11-29 08:21:20
【问题描述】：

这是我的代码。我有很多部分模板，但我的角度路由不起作用，并且控制台中没有错误。谁能告诉我我正在犯的错误并提前致谢。

在我尝试添加路由之前一切正常。我读到 Angularjs 1.2+ 版需要“ngRoute”作为依赖项（我使用的是 1.2.16 版）。我添加了它，但它仍然不起作用。以下是我的代码。

index.html(主页)

<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Angular Library -->
    <script type="text/javascript" src="library/angular.js"></script>
    <script type="text/javascript" src="library/angular-route.js"></script>
    <script type="text/javascript" src="library/angular-animate.js"></script>

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

     <!-- Custom CSS -->
    <link rel="stylesheet" href="css/style.css">


     <!-- Custom JS -->
    <script type="text/javascript" src="js/animate.js"></script>
  </head>
  <body ng-app="app">
    <div id="main">
    <div class=" amber">
    <div>
     <i class="fa fa-facebook-f social" style="font-size:24px; cursor:pointer; padding:10px"></i>
     <i class="fa fa-instagram" style="font-size:24px; cursor:pointer; padding:10px"></i>
     <i class="fa fa-twitter" style="font-size:24px; cursor:pointer"></i>
    </div>
     <div class="pullLeft container"> 
      <a href="#/home">HOME</a>
      <a href="#/menu">MENU</a>
      <a href="#/our_vision">POPULAR PRODUCTS</a>
      <a href="#/contact_us">COMBOKITS</a>
      <a>OUR VISION</a>
      <a>CONTACT</a>
    </div>
    </div>
    <div ng-view>
    </div>
    </div>
    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script>
  </body>
</html>

script.js

var app = angular.module('app',['ngRoute','ngAnimate']);

                app.config(function ($routeProvider){
                 $routeProvider
                 .when('/',{
                        templateUrl: '../Templates/home.html'
                 })
                 .when('/home',{
                        templateUrl: '../Templates/home.html'
                 })
                 .when('/menu',{
                        templateUrl: '../Templates/menu.html'
                 })
                 .when('/our_vision',{
                        templateUrl: '../Templates/our_vision.html'
                 })
                 .when('/contact_us',{
                        templateUrl: '../Templates/contact_us.html'
                 })
                 .otherwise({
                    redirectTo: '/'
                 });
                 });


app.controller('TestCtrl',function TestCtrl() {
  var self = this;

  this.showBoxOne = false;
  this.showBoxTwo = false;
  this.showBoxThree = false;
  this.showBoxFour = false;

});

【问题讨论】：

检查您的 package.json 或 bower.json 是否有此依赖项，并且您已运行 npm install 或 bower install？
@lloyd 我使用 XAMPP 作为服务器
check this post

标签： javascript html css angularjs routing

【解决方案1】：

@Aria，我试过你的样品，似乎工作正常。您确定在服务器端您的文件夹结构正确且文件可用。只是怀疑模板文件路径可能有问题，如果您在那里遇到任何错误，您也可以检查服务器日志。

【讨论】：