Question

我在angularjs版本1.6.9上使用ngRoute时出现问题。

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

1）如果我尝试像“http://localhost:8080/test/rafael”这样的广告，我收到了消息：

“JBWEB000065：HTTP状态404 - / test / rafael”

2）如果我尝试“http://localhost:8080/#/test/rafael”之类的地址，则会更改为“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>

MainController：

    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'
    });
});

ByName控制器：

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";
}

ByName查看：

<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的问题

1 个答案: