当页面仅在IE10上加载时,AngularJS的表单字段是肮脏和无效的

AngularJS form field is dirty and invalid when page loads on IE10 only

本文关键字:字段 表单 无效 AngularJS IE10 加载      更新时间:2023-09-26

我有一个简单的登录表单,在IE10上,当页面加载时,表单字段总是无效的,而用户没有做什么。

表单字段非常简单:

<input type="text" required class="input-block-level" placeholder="username" ng-model="username" name="username" tabindex="1">
<p class="text-error" ng-show="loginForm.username.$dirty && loginForm.username.$invalid">
    <span ng-show="loginForm.username.$error.required">required</span>
</p>

http://plnkr.co/edit/DNUanGGaZDgFWYrm3gLK?p =

预览

在上面的柱塞中,您可以通过关注字段来重现问题,而在我的应用程序中,当页面加载时显示错误字段。

有人为此写了一个要点,我在下面复制了所有必要的样板文件:

angular-hacks.js:

(function (window, angular, undefined) {
    'use strict';
    var hacks = angular.module('hacks', []);
    hacks.config(['$provide', function ($provide) {
        $provide.decorator('$sniffer', ['$delegate', function ($sniffer) {
            var msie = parseInt((/msie ('d+)/.exec(angular.lowercase(navigator.userAgent)) || [])[1], 10);
            var _hasEvent = $sniffer.hasEvent;
            $sniffer.hasEvent = function (event) {
                if (event === 'input' && msie === 10) {
                    return false;
                }
                _hasEvent.call(this, event);
            }
            return $sniffer;
        }]);
    }]);
})(window, window.angular);
到目前为止,我还没有遇到任何问题,尽管我不会假装我已经对它进行了任何严肃的回归测试。它过滤掉了IE10的所有输入事件,可能需要更具体。

我的变通办法:

ng-if="true"添加到输入元素。

仅在angular 1.2.28上测试过