Question

我的应用程序在plunker中运行，在本地无效。它返回以下错误：

XMLHttpRequest无法加载file：/// C：/Amanuel/Coding/Angular.Js/page.html。交叉源请求仅支持协议方案：http，数据，chrome，chrome-extension，https，chrome-extension-resource。

为什么我收到此错误？

的index.html：

<!DOCTYPE html>
<html lang= "en">

<head>
    <meta charset="UTF-8" />
    <title>Angular Js</title>
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.8/angular.js" data-semver="1.4.8"></script>
    <script src = "https://rawgit.com/nirus/Angular-Route-Injector/master/dist/routeInjector.js"></script>
    <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular-route.js"></script>
    <script type="text/javascript" src="main.js"></script>
</head>

<body ng-app = "app">
  <div ng-view></div>
</body>
</html>

page.html中：

Hello World

main.js：

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

app.config(function($routeProvider){

  $routeProvider.when('/', {
    templateUrl: 'page.html'

  })

  .when('/helloUser', {
      template: "ds"

  })

  .otherwise({
    redirectTo: '/'
  })

})

以下是控制台的屏幕截图：

Answer 1

Angular路由器实现使用ajax下载模板文件。当我们直接打开文件时，这不起作用。您需要启动服务器并从服务器打开文件才能使其正常工作。

您可以使用任何您喜欢的服务器。我最简单的方法是安装一个http-server npm模块并从项目目录启动服务器，如下所示。

如果您已经安装了node和npm。在命令行上执行以下操作。

npm install -g http-server

在项目目录

中

http-server

XMLHttpRequest无法加载file：/// C：/

1 个答案: