AngularJs

使用angular开发的模块在IE8/9浏览器中不停刷新的问题

2015-01-07  本文已影响249人  飞将军

出现问题的模块:
燕麦企业云盘 后台管理购买中心

通过不停注释代码, 我一步步缩小问题代码范围, 最终定位为IE8注册window的resize事件有问题

有问题的代码:

angular.module("commons.directives").directive("qyResize", [
    '$window',
    qyResize
]);

function qyResize($window) {
    'use strict';

    return {
        restrict: 'EA',
        replace: false,
        transclude: false,
        link: function (scope, elem, attrs) {
            $(window).resize(function () {
                location.reload();
            });
        }
    };
}

修复以后的代码:

angular.module("commons.directives").directive("qyResize", [
    '$window',
    qyResize
]);

function qyResize($window) {
    'use strict';

    return {
        restrict: 'EA',
        replace: false,
        transclude: false,
        link: function (scope, elem, attrs) {

            var winWidth = $(window).width(),
                winHeight = $(window).height(),
                resizeTimeout = null;

            $(window).resize(function () {
                var onResize = function () {
                    //The method which alter some css properties triggers
                    //window.resize again and it ends in an infinite loop
                    location.reload();
                };

                //New height and width
                var winNewWidth = $(window).width(),
                    winNewHeight = $(window).height();

                // compare the new height and width with old one
                if (winWidth != winNewWidth || winHeight != winNewHeight) {
                    window.clearTimeout(resizeTimeout);
                    resizeTimeout = window.setTimeout(onResize, 10);
                }
                //Update the width and height
                winWidth = winNewWidth;
                winHeight = winNewHeight;
            });
        }
    };
}

这个问题是因为IE8的resize事件触发有问题, 它在刚进入页面时一定会触发该事件.

angular版本的登录和注册功能没有问题是因为他们中没有用到qy-resize

上一篇 下一篇

猜你喜欢

热点阅读