Question

我在AngularJS中完成了以下操作。数据来自提到的URL。如果您打开URL，则可以看到它提供的响应。

但是，我无法通过angularjs获取HTML中的标题。我得到一个空白的结果。我究竟做错了什么？它与JSON编码有关吗？

<!doctype html>
<html ng-app>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
    <script>
    function ActivitiesListCtrl($scope) {
  $http.get('http://www.omdbapi.com/?t=the%20shawshank%20redemption').success(function (data) {
    $scope.mydata = data;
  }
}
 </script>
  </head>
  <body ng-controller="ActivitiesListCtrl">
  <h1>Movie Name</h1>
  <ul>
   <li ng-repeat="data in mydata">
     {{data.Title}}
   </li>
  </ul>
</body>
</html>
</html>

Answer 1

您的代码存在很多错误:-( 语法错误，而不是注入$ http，响应是单个电影而不是集合。

请尝试以下操作。

<!doctype html>
<html ng-app>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
    <script>
    function ActivitiesListCtrl($scope, $http) {
  $http.get('http://www.omdbapi.com/?t=the%20shawshank%20redemption').success(function (data) {
    $scope.mydata = data;
  });
}
 </script>
  </head>
  <body ng-controller="ActivitiesListCtrl">
  <h1>Movie Name</h1>
    {{mydata.Title}}
</body>
</html>

集合示例：

<!doctype html>
<html ng-app>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
    <script>
    function ActivitiesListCtrl($scope, $http) {
  $http.get('http://www.omdbapi.com/?s=True%20Grit').success(function (data) {
    $scope.mydata = data;
  });
}
 </script>
  </head>
  <body ng-controller="ActivitiesListCtrl">
  <h1>Movie Name</h1>
    <ul> 
       <li ng-repeat="data1 in mydata.Search"> {{data1.Title}} </li> 
    </ul>
</body>
</html>

Answer 2

我创建了一个working plunker错误，包括：没有创建应用模块，没有注入$ http，试图迭代你的范围不知道的“数据” - 因为你的范围内有“mydata” 。并以错误的方式迭代对象。（如果你得到一个对象数组，那么迭代这样是正确的）见this answer for details

无法在角度JS中获取正确的数据

2 个答案: