将参数传递给服务以与$ http.get()一起使用

时间:2015-02-11 15:01:26

标签: angularjs angularjs-scope

我已经创建了一个使用API​​的服务。我需要从我的控制器调用此服务,其中的参数是从表单上的文本输入传入的。

myAppServices.factory('apiService', function ($http, $q) {

    return {
        getDocuments: function () {
            return $http.get('/api/documents/', 
                {
                    params: {
                        id: '2' // this should not be hardcoded
                    }
                })
                .then(function (response) {
                    if (typeof response.data == 'object') {
                        return response.data;
                    } else {
                        // invalid response
                        return $q.reject(response.data);
                    }
                }, function (response) {
                    // something went wrong
                    return $q.reject(response.data);
                });
        },
}

我的控制器目前看起来像这样......

myApp.controller('homeController', function ($scope, apiService) {

    var docs = function () {
        apiService.getDocuments()
            .then(function (data) {
                $scope.docs = data; //console.log(data);
            }, function (error) {
                // promise rejected ... display generic no data found on table
                console.log('error', error);
            });
    };
}

我的意见很简单......

 <input type="text" class="form-control" placeholder="Enter ID" ng-model="id">

如何将输入的值输入到我的服务中,以便根据输入到文本输入的ID值返回数据?

3 个答案:

答案 0 :(得分:2)

您需要将参数传递给服务方法,您可以考虑一些建议。

1-)承诺api和您服务的方法。

使用$ q的正确方法是在自己中使用延迟对象。你的服务可能就像。

myAppServices.factory('apiService', function ($http, $q) {

            return {
                getDocuments: function (id) {

                    var deferred = $q.defer();

                    $http({
                        method: 'GET',
                        url: '/api/documents/',
                        params: {id: id}
                    }).success(function (response) {
                        if (typeof response.data == 'object') {
                            deferred.resolve(response.data);
                        } else {
                            deferred.reject(response.data);
                        }
                    }).error(function (response) {
                        deferred.reject(response.data);
                    });

                    return deferred.promise;
                }
            }
        })

2-)你的控制器可能就像。

myApp.controller('homeController', function ($scope, apiService) {

        $scope.getDocs = function () {
            apiService.getDocuments($scope.id)
                    .then(function (data) {
                        $scope.docs = data; //console.log(data);
                    }, function (error) {
                        // promise rejected ... display generic no data found on table
                        console.log('error', error);
                    });
        };
    });

答案 1 :(得分:0)

您只需在服务定义中传递其他参数即可。然后,当您在控制器中使用它时,您可以传递其他值。

myAppServices.factory('apiService', function ($http, $q) {
      return {
            getDocuments: function (param1, param2) {

            }

答案 2 :(得分:0)

应该是这样的:

在您的控制器中

apiService.getDocuments($scope.id).then...

在您的服务中

getDocuments: function (idVar) {
     return $http.get('/api/documents/', 
          {
             params: {
                  id: idVar // this should not be hardcoded
             }
          })