AngularJS服务，包含来自REST API的数据

Question

我开始阅读Angular中的services，并对如何在$http中使用它们感到困惑。

我目前使用$http从我的REST API获取数据，如下面的代码所示;

$scope.getRestaurant = function () {
    var baseUrl = 'http://api.example.com/web/restaurant/details/' + $scope.id;
    $http({
        method: 'get',
        url: baseUrl,
        headers: {'Content-Type': 'application/json'}
    }).
    success (function(data, status, headers, config){
        if(data && !angular.isUndefined(data) ){
            $scope.restaurant = data;
        } else {
            $scope.restaurant = [];
        }
    }).
    error(function(data, status, headers, config) {
        //$scope.messageFailure(data.message);
    });
}

$scope.id是controller上的值，如何将此函数转换为service，然后访问控制器中返回的数据？

Answer 1

这是如何创建具有带参数的函数的工厂或服务，然后可以将控制器中的$ scope.id传递给该函数。 首先，创建一个工厂：

app.factory('myFactory', function($http) {

    var factory = {};

    var _myfunction = function(id)
    {
        return $http.get('http://api.example.com/web/restaurant/details/'+id);
    }

    factory.myFunction = _myfunction;

    return factory;
});

然后在您的控制器中，您将拥有：

app.controller('myCtrl', function('myFactory'){
    var x = $scope.id;

    $scope.getRestaurant = function (x) {
        myFactory.myFunction(x).success(function(data, status, headers, config){
            //whatever...
        }).error(function(){
            // whatever....
        })
    };
});

当然，这只是一个普遍的想法，你需要调整它以满足你的确切需求。

Answer 2

您必须将service注入controller并通过那里与之交谈。

快速举例：

您的服务

app.service '$restaurants', ['$http', '$q', ($http, $q) ->
    fetch: (id) ->
        deferred = $q.defer()
        config =
            url: "//api.example.com/web/restaurant/details/#{id}"
            method: 'GET'
            headers: 'Content-Type': 'application/json'
            dataType: 'json'

        x = $http config
        x.error (data, status) -> deferred reject data, status
        x.success (response, status, headers, config) ->
            deferred.resolve response

        deferred.promise

Controller注入服务

app.controller 'GodClass', ['$restaurants', ($restaurants) ->
    $scope.id = 1

    $restaurants.fetch($scope.id).then (response) ->
        console.log response

非常简化，但它会根据您传递给服务的ID获得结果。