AngularJs NgRoute 的问题

Question

我在 angularjs 版本 1.6.9 上使用 ngRoute 时遇到问题。

我做了一个简单的路由，比如“/test/:yourname”，其中 "yourname" 应该是一个变量，问题是：

1) 如果我尝试像“http://localhost:8080/test/rafael”这样的地址，我收到消息：

"JBWEB000065: HTTP Status 404 - /test/rafael"

2) 如果我尝试使用“http://localhost:8080/#/test/rafael", it changes to "http://localhost:8080/#!#%2Ftest%2Frafael”这样的地址，但只显示一个空白页。

调试时我可以看到带有路由的模块已加载，但从未调用控制器。

索引：

<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-route.js"></script>
    <script src="MainController.js"></script>
    <script src="ByName/ByNameModule.js"></script>
    <script src="ByName/ByNameController.js"></script>
</head>
<body ng-app="ProjectX" ng-controller="MainController">
    <ng-view></ng-view>
</body>

主控制器：

    var app = angular.module("ProjectX", ["ByName"]);

    app.controller('MainController', MainController);
    MainController.$inject = ['$scope', '$rootScope', '$location'];

    function MainController($scope, $rootScope, $location) {

    }

ByName 模块：

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

app.config(function($routeProvider, $locationProvider) {    
    $locationProvider.hashPrefix('');
    $locationProvider.html5Mode(true);

    $routeProvider.when('/test/:yourname', {
            templateUrl : 'ByName/ByNameView.html',
            controller : 'ByNameController',
            controllerAs : 'vm'
    });
});

控制器名称：

var app = angular.module("ByName");

app.controller('ByNameController', ByNameController);
ByNameController.$inject = ['$scope', '$routeParams'];

function ByNameController($scope, $routeParams) {
    var vm = this;
    vm.yourname = $routeParams.yourname;
    $scope.firstName = "John1";
    $scope.lastName = "Doe2";
}

按名称查看：

<div>
    {{vm.yourname}}
</div>

Answer 1

似乎与 AngularJS: route provider changes "/" into %2F

重复

可能设置 $locationProvider.hashPrefix(''); $locationProvider.html5Mode(true); 在您的主模块配置上将解决您的问题。

根据 OP 的评论编辑：
像这样：

var app = angular.module("ProjectX", ["ByName"]); 
app.config(function($routeProvider, $locationProvider) {     
  $locationProvider.hashPrefix(''); 
  $locationProvider.html5Mode(true); 
}); 
app.controller('MainController', MainController); 
function MainController($scope, $rootScope, $location) {}

AngularJs NgRoute 的问题

Problema With AngularJs NgRoute

javascript

html

angularjs

angular-ui-router