Question

我正在通过JSON练习Web API。

在我使用的网址（https://www.ebi.ac.uk/europepmc/webservices/rest/search?query=malaria&format=json）中，有ID，titles等字段。我想调用标题并显示它。以下是我目前的代码：

app.controller("europepmc", ['$scope', '$http', function($scope, $http) {
  $http.get('https://www.ebi.ac.uk/europepmc/webservices/rest/search?query=malaria&format=json')
    .success(function(data) {
      $scope.magazine = data;
    });
}]);

我的控制器以下列方式绑定html日期：

<div ng-controller="europepmc">
  <p>The magazine title is  is {{magazine.title}}</p>
</div>

成功开发此代码后，我无法获得标题。

Answer 1

您收到的JSON有更多属性供您查看，然后才能从结果中获得title。您应该首先使用.resultList.result来扩展它。然后使用ng-repeat显示此数组。

这是一个演示：

var app = angular.module("pmc", []);
app.controller("europepmc", ['$scope', '$http', function($scope, $http) {
  $http.get('https://www.ebi.ac.uk/europepmc/webservices/rest/search?query=malaria&format=json')
    .then(function(res) {
      $scope.magazines = res.data.resultList.result;
    });
}]);

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

<body>

  <div ng-app="pmc" ng-controller="europepmc">

    <div ng-repeat="magazine in magazines">
      {{magazine.title}}
      <hr>
    </div>

  </div>

</body>

</html>

以下是查看整个回复的演示：

var app = angular.module("pmc", []);
app.controller("europepmc", ['$scope', '$http', function($scope, $http) {
  $http.get('https://www.ebi.ac.uk/europepmc/webservices/rest/search?query=malaria&format=json')
    .then(function(res) {
      $scope.magazine = res.data;
    });
}]);

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

<body>

  <div ng-app="pmc" ng-controller="europepmc">
    <pre>
      {{magazine | json}}
    </pre>
  </div>

</body>

</html>

Answer 2

你的Json对象确实有title属性，但更深一点：

object.resultList.result.0-24.title

更好地看一下，粘贴你的Json：

http://jsonviewer.stack.hu/

并查看查看器标签。

Answer 3

//在角度控制器代码中 var app = angular.module（＆＃34; myApp＆＃34;，[]）;

app.controller（＆＃34; europepmc＆＃34;，[＆＃39; $ scope＆＃39;，＆＃39; $ http＆＃39;，function（$ scope，$ http）{

executetransaction

}]）;

// HTML页面代码使用ng-repeat在magazineList中循环播放mg - 然后使用mg.title

如何通过Angular JS中的URL调用JSON数据

3 个答案: