AngularJS / How to prevent IE triggering automatic

问题:

I have some page with some forms.
Each form contains some constraints on fields, like required and more.

I want to display errors on validation only when user interacts with them (UX? => yes).
Indeed, as long as the field is $pristine meaning no touched, no errors should be displayed.

I managed to achieve this requirement with a lot of browsers, except... Internet Explorer (especially IE > 10). Indeed, IE seems to consider all fields as $dirty from the beginning!

Surfing on the web, I found this "fix":

MyMainAppModule.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;
        }]);

Running it and... wowww IE plays nicely now. Running it then in Safari Mobile (Iphone)...disappointment. Why? Because any typed characters are taking into account AFTER event handlers like $watch etc...leading to a shift between what was expected with what occured. It's a pity since it worked well in Safari Mobile before.

So, the actual dilemma is: to give priority to Safari Mobile or IE :)

Has someone ever experimented this situation in IE? Is there some other "better" fixes that I could implement?

回答1:

RETURN _hasEvent.call(this, event);