Question

我正在使用AngularJS构建一个简单的个人联系人管理应用程序。我把所有文件放在Mac机器的htdocs/angular-contacts/文件夹中。

enter image description here

的index.html

<!DOCTYPE html>
<html ng-app='ContactsApp'>
    <head>
        <title>Contacts</title>
        <base href='/'></base>
    </head>
    <body>
        <h1>Contacts</h1>
        <div ng-view=""></div>
        <script src='/angular-contacts/jquery-2.1.3.min.js'></script>
        <script src='/angular-contacts/angular.min.js'></script>
        <script src='/angular-contacts/angular-route.min.js'></script>
        <script src='/angular-contacts/angular-route.min.js.map'></script>
        <script src='/angular-contacts/app.js'></script>
        <script src='/angular-contacts/controller.js'></script>
    </body>
</html>

app.js

angular.module('ContactsApp', ['ngRoute']);
    .config(function($routeProvider,$locationProvider){
        $routeProvider
            .when('/contacts',{
                controller: 'ListController',
                templateUrl: 'list.html'
            });
        $locationProvider.html5Mode(true);
    });

controller.js

angular.module('ContactsApp')
    .controller('ListController',function($scope){
        $scope.contacts = [];
    })

list.html

<p>List views...</p>

为什么我转到http://localhost:8888/angular-contacts/contacts，我收到404 Not Found错误。

如何解决这个问题？如何加载list.html？

注意：

我正在使用MAMP（Apache）。
AngularJS：v1.3.14
Angular Route：v1.3.14

Answer 1

那是因为

$routeProvider
    .when('/contacts',{
        controller: 'ListController',
        templateUrl: 'list.html'
    });

需要http://localhost:8888/contacts位置，而不是http://localhost:8000/angular-contacts/contats位置。

您应该在路由声明中添加前缀，甚至更好，conifgure the virtual host，这样您就可以使用真实域名，而不是localhost的子目录。< / p>

ngRoute返回404 Not Found错误

1 个答案: