IE窗口失去了对任何XMLHttpRequest启动Angular应用程序的关注

IE Window loses focus on start of Angular app with any XMLHttpRequest

本文关键字:应用程序 Angular 启动 XMLHttpRequest 失去 窗口 任何 IE      更新时间:2023-09-26

我在IE 10和11中看到了一些奇怪的行为,在加载AngularJS应用程序时,窗口会失去焦点。只有在最初加载页面时发出XMLHttpRequest请求时才会发生这种情况。之后的任何应用程序交互,无论是否使用ajax,都是正常的。我已经尝试使用$resource和$http来发出请求。两者的结果相同。我的应用程序的资源模块定义为:

/**
 * Resource module
 */
angular.module('appname.resources.sampleData', ['ngResource'])
  .service('sampleDataResource', ['$resource', 'restUrl', SampleRestResource])
  .constant('restUrl', '/url/path/to/rest/data/:id');
/**
 * Resource definition
 */
function SampleRestResource ($resource, restUrl) {
  this.resource = $resource(restUrl);
}
/**
 * Resource query function
 */
SampleRestResource.prototype.query = function () {
  return this.resource.query().$promise;
};

使用其余资源的页面控制器定义为:

/**
 * Page module definition
 */
 angular.module('appname.pages.defaultpage', [])
   .constant('strTitle', 'Page Title')
   .controller('defaultPageController', ['$scope', 'strTitle', 'sampleDataResource', DefaultPageController]);
/**
 * Page controller definition
 */
function DefaultPageController($scope, strTitle, sampleDataResource) {
    $scope.pageTitle = strTitle;
    sampleDataResource.query().then(function(data) {
        $scope.sampleDataFromResource = data;
    });
}

如果我用等效的JQuery交换控制器中的ajax请求,则窗口不会失去焦点。然后控制器变为:

/**
 * Page controller definition
 */
function DefaultPageController($scope, strTitle, sampleDataResource) {
  $scope.pageTitle = strTitle;
  $.get("/url/path/to/rest/data").done(
      function(data){
          $scope.sampleDataFromResource = data;
      }
  );
}

正如我在这个问题的介绍中提到的,当使用"templateUrl"在$routeProvider配置或指令定义中请求HTML模板时,我看到了相同的结果。然而,我开始使用grunt-html2js,并对它作为一种解决方案感到非常满意。

我并不反对使用JQuery,但在这种情况下,我宁愿使用Angular框架来保持代码的一致性和可测试性。如果有人能纠正我的方法或有任何想法,我将不胜感激。

问题是由angular block ui插件引起的。我们正在/曾经使用它来处理ajax请求的所有"请等待"消息。一旦我从我的应用程序中删除了插件,问题就不再发生了。对于其他感兴趣的人来说,我使用的插件版本是0.2.0。只要用默认行为加载插件(并在加载应用程序时发出ajax请求)就可以复制这个问题。