Question

我创建了一些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.

someboy可以帮助我解决这个问题或解释我做错了什么吗？因为我只是Angular的初学者，我赞成任何建议

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

Answer 1

由于您是直接打开HTML文件，因此不允许您执行HTTP请求。您需要设置本地服务器。

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

1 个答案: