Angular $http.get DATA - XMLHttpRequest 无法加载答案

【问题标题】：Angular $http.get DATA - XMLHttpRequest cannot loadAngular $http.get DATA - XMLHttpRequest 无法加载
【发布时间】：2015-09-01 18:40:21
【问题描述】：

我创建了一些我尝试用我的角度访问的 json 文件。

我的 JSON 看起来像：

[
  {"name": "China", "population": 12313214314},
  {"name": "USA", "population": 97888945},
  {"name": "Germany", "population": 456789},
  {"name": "Uzbekistan", "population": 18877},
  {"name": "Tadžikistan", "population": 499999},
  {"name": "Turkistan", "population": 111111}
]

非常简单的对象列表，其中只是国家名称和一些虚构的人口。

我在上面创建了一个控制器，看起来像：

// Somewhere on a top is this line
var app = angular.module('myApp', []);
// And controller here
        app.controller('CountryJsonCtrl', function($scope, $http){
            $http.get('countries.json').success(function(data){
                $scope.counties = data;
            })
        })

在 HTML 中它看起来像：

<div ng-controller="CountryJsonCtrl">
    <table>
        <tr>
            <th>Country</th>
            <th>Population</th>
        </tr>
        <tr ng-repeat="country in countries">
            <td>{{country.name}}</td>
            <td>{{country.population}}</td>
        </tr>
    </table>
</div>

所以我创建了一个表，每一行都应该通过 ng-repeat 在新行中。尽管国家没有加载到 APP 中，所以我查看浏览器控制台出现此错误：

XMLHttpRequest cannot load file:///C:/AngularJS/countries.json. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

谁能帮我解决这个问题或解释我做错了什么？因为我只是 Angular 的初学者，所以我欢迎任何建议

编辑：在@Jon Snow 的建议下，我在 localhost 上运行它，结果控制台中没有更多错误，我看到 json 已加载到网络选项卡中，但站点上仍然没有结果。

【问题讨论】：

标签： json angularjs http

【解决方案1】：

您不能执行 HTTP 请求，因为您是直接打开 HTML 文件。您需要设置一个本地服务器。

【讨论】：

感谢 adivse，像 XAMPP 这样的 apache 够用吗？还是我需要别的东西？
是的，XAMPP/WAMP 应该可以很好地完成这项工作。
酷，我只是在本地主机上运行它，@Jon Snow 我可以请你检查我的编辑吗？
光看就很难知道为什么它不起作用，但是你能在控制台中记录数据吗？
只要找出来，在控制器和 HTML 中拼写错误