使用承诺$ scope的问题

我试图设置一个简单的控制器，使用服务进行异步http调用。我为我编写的另一个控制器设置了非常相似的东西，但由于某种原因，这个控制器无法正常工作。这个console.log（$ scope.art）;在then（）块中的行输出正确的数据，但是一旦它不在then（）块中，$ 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; 
    }; 
}]);

非常感谢！

来源

2016-09-18 Carter Scott Davis

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

或者，如果您只需要显示用户的art对象，它将在服务器返回dat后立即出现。也许你可以添加这样的东西来表示数据beeing从服务器加载：

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

来源

2016-09-18 05:29:23

哦，老天爷我是一个傻瓜的文章！这很有意义。谢谢！ –

欢迎来到javascript＆async @CarterScottDavis :) –

在下面的代码

app.controller('FeedbackController', ['$scope','getArt', function($scope, getArt) { 
    var art = getArt(); 
    art.then(function(result) { 
     $scope.art = result; //line 4, executed some time in the future 
     console.log($scope.art); //line 5 
    }, function(reason) { 
     $scope.error = reason; 
    }); 
    console.log($scope.art); //line 9, synchronously, executed right away 
}])

线9被右后立即执行调用服务器被触发，这是行4和行5（当承诺履行时），所以当发生这种情况$ scope.art仍然是undefined（或仍然有一些旧值）

仅供参考，下面的解释JavaScript的异步真的很好http://tutorials.pluralsight.com/front-end-javascript/introduction-to-asynchronous-javascript

来源

2016-09-18 05:45:04

使用承诺$ scope的问题

回答

相关问题