AngularJS数据从网页api提取

我是新来的，有一个问题:-) 我已经开始使用angularJS，现在正在制作SPA，从网页api获取数据并显示给个人。实际上，它是一个电影搜索应用程序，向omdbapi网站发送请求并获取有关电影标题的数据，例如：标题，年份，图片，演员等等...... 我的应用程序可以抓取并显示数据，但我堆放在当搜索得到多于一个结果（对象）时返回。如果我使用http://www.omdbapi.com/?t=Batman与$ http，我的应用程序将显示它在数据库中找到的第一部电影，但如果我使用http://www.omdbapi.com/?s=Batman，应用程序将在日志控制台中获得9个结果（范围对象）的响应，当我检查$ scope但不会显示任何。因此，我的问题有点理论上的问题。如何在视图中显示所有这些响应。对不起，我是angularJS的新手，仅仅三天检查，但这是我无法在网上找到的东西。我的CAngularJS数据从网页api提取

var app = angular.module('movies', []) 
app.controller('startmovie', function ($scope, $http) { 
    $scope.film = "Game"; 
    $scope.click = function() { 
     $http({ 
      url: 'http://www.omdbapi.com/?s=' + $scope.film , 
      method: 'GET' 
     }).then(function (response) { 

      $scope.movie = response.data; 
     }, function (response) { 
      alert("neuspješno"); 
     } 

       ); 
    }; 
});

我的控制台日志：

搜索

[Object { Title="Game of Thrones", Year="2011–", imdbID="tt0944947", more...}, Object { Title="The Imitation Game", Year="2014", imdbID="tt2084970", more...}, Object { Title="Sherlock Holmes: A Game of Shadows", Year="2011", imdbID="tt1515091", more...}, 7 more...]

Object { Title="Game of Thrones", Year="2011–", imdbID="tt0944947", more...}

Object { Title="The Imitation Game", Year="2014", imdbID="tt2084970", more...}

Object { Title="Sherlock Holmes: A Game of Shadows", Year="2011", imdbID="tt1515091", more...}

Object { Title="The Game", Year="1997", imdbID="tt0119174", more...}

Object { Title="Ender's Game", Year="2013", imdbID="tt1731141", more...}

Object { Title="Spy Game", Year="2001", imdbID="tt0266987", more...}

Object { Title="The Game Plan", Year="2007", imdbID="tt0492956", more...}

Object { Title="The Crying Game", Year="1992", imdbID="tt0104036", more...}

来源

2017-01-29 Bognar

使用数据，鉴于你必须把它们放在$范围内第一个（你已经这样做）

则可以显示“$ scope.yourvar”与{{yourvar}}在风景。 NG-重复用于迭代数组（$scope.movie.Search）一点例如：

<div ng-controller="startmovie"> 
    <button ng-click="click()"> 
    click 
    </button> 

    <pre>{{movie}}</pre> 
    total movies : {{movie.totalResults}}<br> 
    <ul> 
    <li ng-repeat="s in movie.Search"> 
     {{s.Title}} - {{s.Year}} 
    </li> 
    </ul>  
</div>

一个工作示例： http://plnkr.co/edit/G4OQ9SsWXEfjwQO2cezx?p=preview

来源

2017-01-29 16:11:26 AlainIb

泰，效果很好:) – Bognar

AngularJS数据从网页api提取

回答

相关问题