2016-02-20 88 views
0

进入一个参数对象服务在我的index.html我有这样的:

<input type="text" ng-model="title" placeholder="Search..." > 
<button type="submit" href="#" ng-click="getSearch()">Submit</button> 
<select ng-model="selected" ng-options="obj.val as obj.display for obj in things"></select> 

和我的控制器:

$scope.getSearch = function(){ 
    svc.search($scope.selected) 
    .then(function(response){ 
    $scope.searchData = response; 
    }); 
    }; 

$scope.things = [ 
    {display: 'Movie', 
    val: {s: $scope.title}}, 
    {display: 'Series', 
    val: 'series'}, 
    {display: 'Epsiode', 
    val: 'episode'}, 
]; 

最后我服务:

this.search = function(params){ 
    return $http.get('http://www.omdbapi.com/',params) 
    .then(function(response) { 
    var results = response.data.Search; 
    return results; 
    }); 
    }; 

好吧,看起来像我差点把它的工作。现在,它的全部工作除了似乎omdbapi不喜欢&编码的参数。

$scope.getSearch = function(){ 
svc.search($scope.selected()) 
.then(function(response){ 
    $scope.searchData = response; 
}); 


}; 

    $scope.things = [ 
    {display: 'Movie', 
    val: function(){return {'type=movie&s': $scope.title};}}, 
    {display: 'Series', 
    val: function(){return {'type=series&s': $scope.title};}}, 
    {display: 'Epsiode', 
    val: function(){return {'type=episode&s': $scope.title};}}, 
]; 

而且我们有答案!当然,一旦我发布了,我想清楚了......一直工作太久。

val: function(){return {type: 'movie',s: $scope.title};}}, 
+0

你喜欢不喜欢,如果我从下拉菜单和类型的电影名称在文本框中选择电影,因此将搜索电影类型化的文字吗? –

+0

是的,这是我想要做的。 – user1490202

+0

你有两个json是分开还是单个json? –

回答

0

请尝试以下我为你做的。它很容易和感谢好的电影API

<!DOCTYPE html> 
<html ng-app="plunker"> 

<head> 
    <meta charset="utf-8" /> 
    <title>AngularJS Plunker</title> 

    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
    <script>document.write('<base href="' + document.location + '" />');</script> 
    <script data-require="[email protected]" src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script> 

</head> 
    <body ng-controller="MainCtrl"> 
     <div class="container"> 
      <div class="row"> 
       <div class="col-lg-3"> 
        <form> 
         <div class="form-group"> 
          <label>Choose type</label> 
          <select class="form-control" ng-model="title"> 
           <option ng-repeat="x in things">{{x.type}}</option> 
          </select> 
         </div> 

         <div class="form-group"> 
          <label>Title (Minimum 2 chars) : </label> 
          <input type="text" ng-model="search_keyword" class="form-control"/>   
         </div> 

         <button class="btn" ng-click="search_movie()"> 
          Search movie 
         </button> 
        </form>  
       </div>    
      </div> 
     </div> 
     <div class="container"> 
      <pre> 
      {{result | json}} 
      </pre>  
     </div> 

    </body> 
</html> 

<script type="text/javascript"> 
    var app = angular.module('plunker', []); 
    app.controller('MainCtrl', function($scope,$http) 
    { 
     $scope.search_keyword = ''; 
     $scope.title = ''; 

     $scope.things = [{type:'movie'},{type:'series'},{type:'episode'}]; 

     $scope.search_movie = function() 
     { 
      console.log($scope.search_keyword+""+$scope.title); 

      $http.get('http://www.omdbapi.com?t='+$scope.title+"&h="+$scope.search_keyword) 
      .then(function(response) 
      { 
       $scope.result = response.data; 
      }); 
     } 

    }); 
</script>