Question

我在一个应该从我的服务器获取数据的服务中进行$http调用。出于某种原因，我无法让我的服务工作 - 没有任何反应。我知道服务器代码有效，因为如果我将$http调用放在我的控制器中的函数内，那么它会按预期获取服务器数据。这是我到目前为止的代码：

app.service('myService', function($q,$compile,$http) {
    this.getData = function() {
        var deferred = $q.defer();
        var promise = $http.get('myfile.php').success(function (data) {
            var response = $compile(data)($scope);
            deferred.resolve(response);
        });
        return deferred.promise; 
    };
});

此外，我知道使用此服务的代码有效，因为如果我执行以下操作，

app.service('myService', function() {
    this.getData = function() {
        return 'TEST';
    };
});

然后我会在使用此服务的div中看到“TEST”这个词。我觉得我非常接近，但有些东西我不知道了。关于我做错了什么想法？

更新：

controller: function($scope, $http, $rootScope, myService){
    var scope = $rootScope;
    scope.viewMyData = function() {
        var element = myService.getData();
        $('#myDiv').html(element);
    }
}

HTML：

<div ng-click="viewMyData()">Click Here</div>
<div id="myDiv"></div>

如果我在myService中删除代码并只返回TEST（如上所述），那么我会在id="myDiv"中看到“TEST”。但由于某些原因，$http来电未被触发。

Answer 1

@tymeJV是对的，但这是我试图更好地拼写出来的例子。 $http返回 promise 接口，允许您链接在$http响应返回时执行的回调。因此，在这种情况下，调用myService.getData()不能立即返回结果（它从服务器获取数据），所以你需要给它一个函数来执行服务器终于回应了。因此，使用promises，您只需使用thePromise.then(myCallbackFunc)附加回调。

服务

app.service('myService', function($q,$compile,$http) { this.getData = function() { var promise = $http.get('myfile.php'); promise = promise.then(function (response) { return response.data; }); return promise; }; });

控制器

controller: function($scope, $rootScope, myService){ var scope = $rootScope; scope.viewMyData = function() { myService.getData().then(function(data) { $('#myDiv').html(element); }); } }

Answer 2

在控制器中使用.then继续承诺模式：

myService.getData().then(function(data) {
    $('#myDiv').html(data);
});

如何通过$ http调用获取访问服务器数据的服务？

2 个答案:

服务

控制器