Question

我想使用用户搜索输入向TMDB数据库发出JSON请求。搜索请求将如下所示http://api.themoviedb.org/3/search/movie?api_key=a8f7039633f2065942cd8a28d7cadad4&query=Bond&callback=angular.callbacks._0这是“Bond”的搜索请求。

我有搜索功能，

$scope.search = function() {

  var base = 'http://api.themoviedb.org/3';
  var service = '/search/movie';
  var apiKey = 'a8f7039633f2065942cd8a28d7cadad4&query='
  var search = searchquery
  var callback = 'JSON_CALLBACK'; // provided by angular.js
  var url = base + service + '?api_key=' + apiKey + search + '&callback=' + callback;

  $http.jsonp(url).
    success(function (data, status, headers, config) {

      if (status == 200) {
        $scope.movieList = data.results;
        console.log($scope.movieList)
      } else {
        console.error('Error happened while getting the movie list.')
      }

    }).
    error(function (data, status, headers, config) {
      console.error('Error happened while getting the movie list.')
    });
}

var searchquery = "Bond"

正如你所看到的，我现在有一个名为searchquery的变量，我给它一个值，但我想用用户输入填充它。

这是我的观点。

%h1
  Logo
%li
  = link_to('Logout', destroy_user_session_path, :method => :delete)

%div{"ng-app" => "app.exampleApp"}
  %div{"ng-controller" => "exampleCtrl"}

    %input{"ng-change" => "search(searchquery)", "ng-model" => "searchquery", "ng-model-options" => "{ debounce: 2000 }"}
    %span
      {{ searchquery }}

    %div{"ng-repeat" => "movie in movieList"}
      {{ movie.original_title }}

目前，这显示了JSON数据中的所有标题。

如何使用输入中的用户值来执行合适的搜索请求？

Answer 1

您已将searchquery绑定到输入的ng-model。您可以使用$scope.searchquery

在控制器中访问此值

您还应该考虑使用params对象来提供URL查询参数：

var apiKey = 'a8f7039633f2065942cd8a28d7cadad4';
var url = base + service;

$http.jsonp(url,{
  params: {
    "api_key" : apiKey,
    "search" : $scope.searchquery,
    "callback" : callback,
  }
}).success()

这应该是诀窍而且更容易理解（而不是自己构建URL）

希望有所帮助

使用用户输入

1 个答案: