每个人我对 Angular JS 都很陌生，所以我想使用Angular 概念，例如使用 ngRoute 进行路由来实现我的要求。
这是我的js代码
var mainApp = angular.module("mainApp", ['ngRoute']);
mainApp.config(function($routeProvider) {
$routeProvider
.when('/home', {
templateUrl: 'home.html',
controller: 'StudentController'
})
.when('/viewStudents', {
templateUrl: 'viewStudents.html',
controller: 'StudentController'
})
.otherwise({
redirectTo: '/home'
});
});
mainApp.controller('StudentController', function($scope) {
$scope.students = [
{name: 'Mark Waugh', city:'New York'},
{name: 'Steve Jonathan', city:'London'},
{name: 'John Marcus', city:'Paris'}
];
$scope.message = "Click on the hyper link to view the students list.";
});
这是我的index.html
**<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8">
<title>AngularJS Routing</title>
</head>
<body>
<div ng-app="mainApp">
<ng-view></ng-view>
</div>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.28/angular.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.28//angular-route.min.js"></script>
<script type="text/javascript" src="main.js"></script>
</body>
</html>
这里是 home.html
<div class="container">
<h2> Welcome </h2>
<p>{{message}}</p>
<a href="#/viewStudents"> View Students List</a>
</div>
当我在浏览器中打开index.html时，它必须加载js代码中提到的home.html。
但我在控制台中收到以下错误
angular.js:8632 Access to XMLHttpRequest at 'file:///E:/battleField/angular/WebContent/WEB-INF/home.html' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
我的代码和页面运行方式有什么问题。请帮助我摆脱这个问题，我引用了以下教程来获取它 <强> https://www.journaldev.com/6225/angularjs-routing-example-ngroute-routeprovider
那里工作正常。 谢谢。
最佳答案
发生此错误是因为您只是直接从浏览器打开 html 文档。要解决此问题，您需要从网络服务器调用页面并在本地主机上访问它。使用 Wamp Server 或 Apache，或者如果您安装了 Nodejs，则使用 http-server
关于javascript - 无法访问Web动态项目中的Angular JS页面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54036919/