javascript - Angular - 在服务 url 中使用范围变量

Question

目前我想从 API 获取数据，使用 AngularJS 服务发送一些搜索参数。在我的 ng-model 中，我有一个名为 search 的变量，我想将该变量用作 API URL 的参数。

我的第一个(不成功的)方法是直接在服务内部使用 $scope.search 变量:

$http.get('http://www.omdbapi.com/?s='+ $scope.search +'&type=series&r=json').then(function(data){
     deferred.resolve(data);
});

我已经 read将 $scope 传递给服务是不可能的(而且无论如何都不应该这样做)，那么我如何使用 scope 变量作为服务中的参数，还有，除了添加之外，是否有更简洁的方法来设置参数字符串 myUrl + search?

完整代码:

 myApp.service('showsService', function($http, $q){
    var deferred = $q.defer(); //promise to say 'im going to do this later'
    $http.get('http://www.omdbapi.com/?s=sherlock&type=series&r=json').then(function(data){
        deferred.resolve(data);
    });
    this.getShows = function(){
        return deferred.promise;
    }
    });

    myApp.controller("showsController", function($scope, showsService){
    $scope.$watch('search', function() {
      fetch();
    });

    function fetch(){
        var promise = showsService.getShows();
        promise.then(function(data){
        $scope.showsResult = data.data.Search; //using the name than comes back from the API
    });
    }
    });

Answer 1

只需将 search 作为参数传递给服务函数:

myApp.service('showsService', function($http){
    this.getShows = function(search){
        var url = 'http://www.omdbapi.com/s='+search+'&type=series&r=json';
        var promise = $http.get(url);
        return promise;
    };
});

然后在 Controller 中:

myApp.controller("showsController", function($scope, showsService){
   $scope.$watch('search', function(value) {
      fetch(value);
   });

   function fetch(search){
       var promise = showsService.getShows(search);
       promise.then(function(response){
           $scope.showsResult = response.data.Search;
       });
    };
});

没有必要使用 $q.defer 制造一个 promise ，因为 $http 服务已经返回了一个 promise 。

---

更新

$http 服务能够序列化参数:

myApp.service('showsService', function($http){
    this.getShows = function(search){
        //var url = 'http://www.omdbapi.com/s='+search+'&type=series&r=json';
        var url = 'http://www.omdbapi.com/'
        var config = { 
            params: { 
                s: search,
                type: 'series',
                r: 'json'
            }
        };
        var promise = $http.get(url, config);
        return promise;
    };
});