gpt4 book ai didi

javascript - 页面未找到错误,甚至路由都给出了 angularJs

转载 作者:行者123 更新时间:2023-12-03 05:42:46 26 4
gpt4 key购买 nike

我正在开发管理面板和用户面板。管理面板工作正常,代码是用 ExpressJs 编写的。现在我想在 AngularJs 中设计我的用户面板。我创建了 HTML 页面和 app.js 页面。

use strict;

angular.module('myApp', ['ngRoute']).config(['$routeProvider', function($routeProvider) {

$routeProvider.when('/home', {
templateUrl: 'home.html',
controller: 'homeCtrl'
});

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

$routeProvider.otherwise({redirectTo: '/home'});
}])
.controller('profileController', function($scope, $http, $routeParams) {
$scope.params = $routeParams;
$http.get('json_files/record_'+$scope.params.userId+'.json').success(function(response) {
$scope.details = response;
});
})
.controller('homeController', function() {

});

这是我的 app.js 文件。

下面是我的个人资料.html

<html lang="en" ng-app="myApp" class="no-js">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>My AngularJS App</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<base href="http://localhost:8000/">
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="app.js"></script>
</head>
<body>
<div ng-controller="profileController">
<table>
<thead>
<tr>
<td>CategoryID</td>
<td>CategoryName</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="category in categories">
<td>{{category.CategoryID}}</td>
<td>{{category.CategoryName}}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>

每当我尝试访问 http://localhost:8000/profile/1 页面时,都会收到如下错误

Not Found

The requested URL /profile was not found on this server.

不知道出了什么问题...或者我哪里做错了...请提出任何建议。

最佳答案

您的索引页中缺少 ng-view。您的所有路线都将被此标签替换。

引用此链接:https://docs.angularjs.org/api/ngRoute/directive/ngView

index.html

<html lang="en" ng-app="myApp" class="no-js">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>My AngularJS App</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular-route.js"></script>
<script src="script.js"></script>
</head>
<body>

<div ng-view></div>

</body>
</html>

home.html

<div> Home page

<a href="#/profile/1" >Go to Profile page</a>

</div>

profile.html

<div> Profile page

<a href="#/home" >Go to Home page</a>

<div>

app.js

(function() {
"use strict";

angular.module('myApp', ['ngRoute'])
.config(['$routeProvider', function($routeProvider) {

$routeProvider.when('/home', {
templateUrl: 'home.html',
controller: 'homeCtrl'
});

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

$routeProvider.otherwise({
redirectTo: '/home'
});

}])

.controller('profileController', function($scope, $http, $routeParams) {
$scope.params = $routeParams;
/*$http.get('json_files/record_' + $scope.params.userId + '.json').success(function(response) {
$scope.details = response;
});*/
})

.controller('homeCtrl', function() {})
.controller('profileController', function() {})

})();

关于javascript - 页面未找到错误,甚至路由都给出了 angularJs,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40465265/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com