如何使用AngularJS搜索烂番茄API

Question

我正在尝试使用angularjs创建烂番茄api的搜索。我希望能够键入查询按enter或go（在电话上），然后api返回查询的结果。

我试图将$scope.search附加到视图中的输入。我知道自己做错了事，但由于缺乏经验，我无法想象该怎么做。寻找某人友善地指引我走向正确的方向。

查看

<input placeholder="Search for it" ng-model="search"> 

控制器

ctrls.controller('resultsCtrl', function($scope, $http){ 
    $scope.search = 'query'; 
    $http.jsonp('http://api.rottentomatoes.com/api/public/v1.0/movies.json', { 
     params: { 
      page_limit: '5', 
      page: '1', 
      q: $scope.search, 
      apikey: myKey, 
      callback: 'JSON_CALLBACK' 
     } 
    }) 
    .success(function (data) { 
     $scope.results = data.movies; 
    }); 
}); 

Answer 1

你将不得不使用一个函数，该函数

ctrls.controller('resultsCtrl', function($scope, $http){ 
    $scope.search = 'query'; 
    $scope.fetchResults = function(){ 
     $http.jsonp('http://api.rottentomatoes.com/api/public/v1.0/movies.json', { 
      params: { 
       page_limit: '5', 
       page: '1', 
       q: $scope.search, 
       apikey: myKey, 
       callback: 'JSON_CALLBACK' 
      } 
     }) 
     .success(function (data) { 
      $scope.results = data.movies; 
     }); 
    } 
}); 

，并从您的视图调用它

<form ng-submit="fetchResults()"> 
    <input placeholder="Search for it" ng-model="search"> 
    <input type="submit" value="Go"/> 
</form>