Question

情况如下：你有一个用户在你的AngularJS应用程序上发送垃圾邮件，这当然是在后端创建各种异步数据调用。问题是，当这些数据提取中的每一个都返回时，用户将在屏幕上看到数据多次改变，并且希望用户最终休息的数据是最后一个数据，这就是他们所看到的。

但我们不能指望这一点，因为异步意味着订单无法保证。页面C的数据很可能在用户跳过而不等待显示的页面B的数据之前到达。现在，用户看到了页面B的数据，因为最后返回但是他们认为他们正在看到页面C.我们如何防止这种情况？

Answer 1

$ http接受一个canceller参数，该参数是一个可用于取消先前请求的promise。当您即将发出新请求时，您将要取消该请求。这是一个基本的例子。请注意，最佳做法不建议在控制器中使用$ http。

var canceller = $q.defer();
 
$http.get("/api/movies/slow/2", { timeout: canceller.promise })
     .then(function(response){
        $scope.movie = response.data;
    });
 
$scope.cancel = function(){
    canceller.resolve("user cancelled");  
};

在此处阅读更多内容：http://odetocode.com/blogs/scott/archive/2014/04/24/canceling-http-requests-in-angularjs.aspx

Answer 2

解决方法非常简单：使用令牌！每个承诺在创建时都会带有令牌的本地副本，并会检查主令牌以确保它仍然相关：

var self = this;

// our token generator
self.generateToken = function() { 
    return return Math.floor(100000000 + Math.random() * 900000000);
}

// our latest token
self.getData = function() {
    self.asyncToken = self.createToken();
    var myToken = self.asyncToken;

    var request = $http({url: "http://google.com"});
    var promise = request.then(function(response) {
        if (myToken !== self.asyncToken) {
            console.log("Got data for expired request.  Ignoring.");
            return;
        }
        // this is data we wanted, so we continue
        self.doStuff(response.data);
    });

    return promise;
};

在AngularJS中处理不再需要的异步数据

2 个答案: