javascript - 使用 promise 的 $scope 问题

Question

我正在尝试设置一个简单的 Controller ，它使用服务进行异步 http 调用。我为我编写的另一个 Controller 设置了一些非常相似的东西，但由于某种原因这个 Controller 不起作用。 then() block 中的 console.log($scope.art); 行输出正确的数据，但是一旦它超出 then() block ，$scope.art 就是未定义的。为什么会这样？我很困惑!

app.controller('FeedbackController', ['$scope','getArt', function($scope, getArt) {
        var art = getArt();
        art.then(function(result) {
            $scope.art = result;
            console.log($scope.art);
        }, function(reason) {
            $scope.error = reason;
        });
        console.log($scope.art);
}])
.factory('getArt', ['$http', '$q', function($http, $q) {
   return function() {

        var deferred = $q.defer();
        $http.post("/php/getArt.php")
            .success(function (response) {
                if (response == "nope") {
                    deferred.reject("Whoopsie! Something seems to have gone wrong.");
                } else {
                    deferred.resolve(response);
                }
            })
            .error(function () {
                deferred.reject("There seems to be an issue with your connection.");
             });
        return deferred.promise;
   };
 }]);

非常感谢!!

Answer 1

http 调用是异步的，因此您 console.log($scope.art); 在 http 调用完成 之前执行。 您可以在 then 回调中进行任何后处理。

或者如果您只需要为用户显示art 对象，它会在服务器返回dat 时立即出现。也许您可以添加类似这样的内容来指示正在从服务器加载数据:

<div ng-if="!art">loading...</div>
<div ng-if="art">... display it for the user ...</div>