Question

我无法通过angularjs获取数据，它在运行时在chrome上显示空白屏幕，因为我是初学者而不知道这个问题。

<div ng-app="myApp" ng-controller="customersCtrl"> 
  <ul>
    <li ng-repeat="x in names">
      {{Word}}{{names}}
    </li>
  </ul>
  <div class="footer"></div>
</div>

这是jsfiddle：demo

提前致谢。

编辑：最后，我得到了解决方案，在尝试了几个小时之后，需要从chrome获得CORS扩展：working demo

Answer 1

'Access-Control-Allow-Origin' - 您的资源API似乎不允许跨源请求

更新您的请求，您可以添加错误响应以捕获此类问题

$http.get("http://randomword.setgetgo.com/get.php")
  .then(function (response) {
    $scope.names = response.data;
    console.log(response);
  },
       function(error){
    console.log('error',error);    
  });

编辑：不知道是谁标记了这个，但是我将api调用更改为允许使用cors并使fiddle显示其工作的调用。

DOM

<div ng-app="myApp" ng-controller="customersCtrl"> 

    <ul>
      <li ng-repeat="x in names.data">
        {{x.title}}
      </li>
    </ul>
            <div class="footer"></div>
    </div>

控制器

var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
  $http.get("http://jsonplaceholder.typicode.com/posts")
  .then(function (response) {
    console.log(response);
    $scope.names = response;
  }, function(error){
    console.log(error);
  });
});

如果您的角度应用与您的API分开托管，那么您将有一点work来允许访问。

无法通过angular.js获取json（api）数据

1 个答案: