AngularJS

Question

我正在尝试显示 JSON 文件中的一些数据，但我无法正确使用 ngRoute。作为记录，我运行本地文件使用 Chrome 的 CORS 插件。当我尝试访问 ~/project/13（其中 13 是一个 ID）时，浏览器 return "File not found"。控制台也没有错误。

代码如下： hello.js

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

myApp.config(function($routeProvider){
                    $routeProvider
                    .when('/project/:projectId',{
                    controller:'GetProjectCtrl',
                    templateUrl:'project.html'
                })
});  
myApp.controller('GetProjectCtrl', ['$routeParams','$scope','$http', function($routeParams,$scope,$http){
        $http.get('http://localhost:8080/project/'+$routeParams.projectId).
    success(function(data) {
        $scope.project = data;
    });
    console.log($routeParams.projectId);
}]);

project.html

<!doctype html>
<html>
<head>
<title>Project</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular-route.js"></script>

<script src="hello.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body ng-app="myApp">
<div id="wrapper">

    <header>
        <div class="header-left">
            <h1>Sonar Monitoring Tool</h1>
        </div>
    </header>

    <table ng-controller="GetProjectCtrl">
    <thead>
        <tr>
            <th>ID</th>
            <th>Name</th>
            <th>URL</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>{{project.id}}</td>
            <td>{{project.name}}</td>
            <td>{{project.url}}</td>
        </tr>
    </tbody>
    </table>
</div>
</body>
</html>

我在这里错过了什么？

稍后编辑

显然有一个错误是：

Not allowed to load local resource: file:///C:/Users/******/Desktop/Angular/project/13

Answer 1

您需要运行您的站点在服务器下。您可以使用 https://www.npmjs.com/package/http-server 一个简单的零配置入门 http 服务器，使用 NPM 安装。

AngularJS - ngRoute 找不到文件

AngularJS - ngRoute can't find file

javascript

ngroute