Question

我正在以角度创建与板球比赛信息相关的应用程序。在获取api响应时遇到问题。你可以查看api回复here。控制台显示错误，请检查

这是我的代码：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>

<body>
<div class="container" ng-app="cricApp" ng-controller="cricCtrl">
<div class="form-group">
<h2>Your result</h2>
<table class="table table-striped">
    <thead>
      <tr><th colspan="4"><h4>Cricket Match Info</h4></th></tr>
      <tr>
      <th>Sno</th>
      <th>unique_id</th>
      <th>description</th>
      <th>title</th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="match in matchList | filter: nameFilter">
        <td>{{$index + 1}}</td>
        <td>
          {{match.unique_id}}
        </td>
         <td>{{match.description}}</td>
        <td>{{match.title}}</td>
      </tr>
    </tbody>
  </table>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>
<script>
angular.module('cricApp', []).
controller('cricCtrl', function($scope, $http) {
$scope.matchList = [];
    $http.get("http://cricapi.com/api/cricket").then(function (response) {
        console.log(response);
        $scope.matchList = response.data;
    });
}
);
</script>
</body>
</html>

Answer 1

你的代码很好，只需替换

 $scope.matchList = response.data;

带

$scope.matchList = response.data.data;

因为实际数据来自response.data中的数据。

以角度获取api数据

1 个答案: