AngularJS 中的 ng-route 不起作用

Question

我正在练习 AngularJS 并且有一个问题： ng-route 即使我添加了 angular-route.js 也不起作用。

这是我的 app.js 文件：

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


app.config(['$routeProvider', function($routeProvider) {
    $routeProvider
    .when('/', {
        templateUrl: 'views/intro.html'
    })
    .when('game', {
        templateUrl: 'views/game.html',
        controller: 'TableController'
    })
    .when('about', {
        templateUrl: 'views/about.html'
    })
    .otherwise({
        redirectTo: '/'
    });
}]);

这是我的 index.html

<!DOCTYPE html>
<html>
<head>
    <title>Color Picking</title>
    <meta name="author" content="pexea12">
    <meta charset="utf-8">
    <meta name="viewport" content="device=device-width, initial-scale=1.0">

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

    <!-- Bootstrap -->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-theme.min.css">

    <!-- Script -->
    <script src="js/bootstrap/jquery-1.11.3.min.js"></script>
    <script src="js/bootstrap/bootstrap.min.js"></script>

</head>
<body ng-app="app">
    <header>
        <br>
        <h2>Color Picking</h2>
        <br>
    </header>

    <div id="main">
       <div ng-view></div>
    </div> <!-- main -->

    <!-- AngularJS -->
    <script src="js/vendor/angular.min.js"></script>
    <script src="js/vendor/angular-route.js"></script>
    <script src="js/app.js"></script>

    <!-- Services -->
    <script src="js/services/ColorService.js"></script>

    <!-- Factories -->
    <script src="js/factories/RandomFactory.js"></script>

    <!-- Controllers -->
    <script src="js/controllers/TableController.js"></script>

</body>
</html>

我的文件夹树是： css（css 个文件，引导程序） js（app.js，控制器，服务，工厂，...）观看次数

我的网站可以使用 http://localhost:8080/，但不能使用 localhost:8080/about 或 localhost:8080/game。

我真的卡在这一点上了，找不到解决办法。

Answer 1

我认为你在 之后遇到了问题。 应该是：

$routeProvider
.when('/', {
    templateUrl: 'views/intro.html'
})
.when('/game', {
    templateUrl: 'views/game.html',
    controller: 'TableController'
})
.when('/about', {
    templateUrl: 'views/about.html'
})
.otherwise({
    redirectTo: '/'
});

您的路线中缺少 /

AngularJS 中的 ng-route 不起作用

ng-route in AngularJS doesn't work

javascript

html

angularjs

ngroute

angularjs-ng-route