Question

我有一个AngularJS应用程序，它使用$ http服务加载一些数据，然后根据修改后的数据更新相应的html元素并更新UI。这是代码：

app.controller("RankingCtrl", function ($scope, PostModel, DeserializePosts, $http, $cookies){
    var mainContainer = $('#mainContainer');

    $scope.error = null;
    function loadTop(){
        $http({
            type: 'GET',
            url: '/ranking',
            headers: {
                'X-Requested-With': 'XMLHTTPRequest',
            }
        }).success(function(topPosts){
            var mostLikedPosts = DeserializePosts(topPosts.mostLiked);
            var mostViewedPosts = DeserializePosts(topPosts.mostViewed);
            var mostCommentedPosts = DeserializePosts(topPosts.mostCommented);

            $scope.topLiked = mostLikedPosts;
            $scope.topViewed = mostViewedPosts;
            $scope.topCommented = mostCommentedPosts;
        }).error(function(error){
            errorHandler(error.statusCode, error);
        }).finally(function () {
            $('#mainContainerSpinner').hide();
            mainContainer.fadeIn();
        });
    }
    loadTop();
});

我的问题是，显然没有调用.success函数，因为.finally函数确实被执行但UI不是任何下载元素的更新。如果我按下IE浏览器窗口，那么该功能正常工作，UI显示预期的元素。 Chrome或FireFox上不会发生此问题。

有趣的是，当我从IE打开F12开发工具来调试这个JS代码时，问题不会发生。看起来更像是IE11上的一个错误，但我想知道是否有其他人看到过这种行为以及是否有可行的解决方法。目前，我的用户需要在访问页面时刷新页面，因为只有页面刷新更新了此AngularJS控制器上的UI。

更新：UI没有得到更新，因为.success函数有forEach指令抛出异常。发生这种情况是因为浏览器正在发送$ http请求而没有上面代码中指定的'X-Requested-With'标头，因此它收到的响应是html而不是json。强制浏览器刷新会使浏览器将此标头添加到http请求。

IE11上没有调用$ http.success回调

0 个答案: