Question

我有简单的angularjs应用程序，我相信我没有正确配置路由，因为在浏览器中，url看起来很奇怪。例如，当我访问我的index.html页面时，这是url：http://localhost:8082/basic-web-app/app/index.html#/，当我导航到应用程序中的其他页面时，它会在index.html后附加位置＃/：http://localhost:8082/basic-web-app/app/index.html#/login我检查的每个示例没有index.html并附加了http://localhost:8082/basic-web-app/app/和http://localhost:8082/basic-web-app/app/login我的路由：

这样的位置

    coursesApp.config(function($routeProvider, $httpProvider) {
    $routeProvider

    // route for the home page
    .when('/', {
        templateUrl: 'pages/home.html',
        controller: 'mainController',
        controllerAs: 'controller'
    })

    // route for the courses page
    .when('/courses', {
        templateUrl: 'pages/courses.html',
        controller: 'coursesController'
    })

    // route for the courses page
    .when('/login', {
        templateUrl: 'pages/login.html',
        controller: 'loginController',
        controllerAs: 'controller'
    })

    .when('/profile', {
        templateUrl: 'pages/profile.html',
        controller: 'profileController'
    });

    $httpProvider.defaults.headers.common["X-Requested-With"] = 'XMLHttpRequest';
});

谢谢你！

Answer 1

问题是您的文件夹结构。

index.html应位于app文件夹之外。

index.html位于前端结构的根目录下。 index.html文件主要处理所有库和Angular元素的加载。

HEre是文件夹结构的一个例子，

app/
----- controllers/
---------- mainController.js
---------- otherController.js
----- directives/
---------- mainDirective.js
---------- otherDirective.js
----- services/
---------- userService.js
---------- itemService.js
----- js/
---------- bootstrap.js
---------- jquery.js
----- app.js

views/
----- mainView.html
----- otherView.html

index.html

以下是您的文件夹结构的一些链接：

https://johnpapa.net/angular-growth-structure/

https://scotch.io/tutorials/angularjs-best-practices-directory-structure

Answer 2

如果我的问题是对的，那么：

你所做的一切都没有错。每个单页应用程序框架（AngularJS就是其中之一）使用哈希 - ＃ - 智能地将用户保持在同一页面上。只要你的观点以你需要的方式呈现，它看起来就好了。

angularjs路由问题 - 追加index.html

2 个答案: