Question

我正在尝试从JSON文件中显示一些数据，但我无法正确使用ngRoute。为了记录，我使用CORS插件为Chrome本地运行文件。当我试图访问〜/ project / 13（其中13是一个ID）时，浏览器返回“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无法找到文件

1 个答案: