Question

我正在尝试使用AngularJS从我的数据库加载一些数据。我有一个应该获取数据的服务和一个使用它的控制器。

请参阅下面的代码：

angular.module('myApp')
    .factory('panelService', ['$http', function ($http) {

        return {
            async: function () {
                return $http.get('/test');  // this returns promise
            }
        };

    }]);


angular.module('myApp')
    .controller('panelCtrl', ['$scope', '$http', function ($scope, $http) {

        var promise = panelService.async()
        promise.then(
            function(payload){
                $scope.user = payload.data;
            }
        )

}]);

不幸的是，这不起作用。没有加载数据，我没有看到任何JSON对象到达浏览器。但是，如果我在控制器中将panelService.async()替换为$http.get('/test')，则可以正常工作。所以我的猜测是我的服务有错误或没有正确调用。

Answer 1

为了让您了解问题以及下次如何自行解决问题，让我们完成您在angularjs中无法正常工作时需要执行的步骤。

首先，检查控制台。你应该得到一个类似的错误： TypeError: Cannot read property 'async' of undefined ...

这应该让您想到为什么async的父对象未定义，快速查看代码会发现您忘记在控制器中注入panelService。

Answer 2

解决方案是将服务注入控制器，如下所示：

angular.module('myApp')
    .controller('panelCtrl', ['$scope', '$http', 'panelService', function ($scope, $http, panelService) {

        var promise = panelService.async()
        promise.then(
            function(payload){
                $scope.user = payload.data;
            }
        )

}]);

AngularJS服务没有返回承诺

2 个答案: