IE placeholder input event fix suppresses an extra event with interpolation #8242
Description
109e5d1 introduced an issue which suppresses an extra input event when a placeholder changes due to interpolation and the input has a value. I believe the extra input event does not fire if the input has a value which causes the next real input event to be ignored. I haven't tested <IE11
See http://plnkr.co/edit/qZSjmzuQfzTbkI9eprcR?p=preview
The 2 inputs using interpolation in the placeholder suppress an extra input event on initialization and again each time the interpolation value changes.
Another issue not solved by 109e5d1 is shown in the last 2 inputs of the plunker. I'm not sure if that should be fixed within angular but it would be nice now that some of the placeholder issues are. Here is the fix I've been using, with 109e5d1 I just had to switch ignoreNextInput
to false since angular handles that initial input event now. This doesn't handle the extra input event when the placeholder changes but that would be easy to add.
//input events order for inputs with placeholders in IE - the focus/blur input event only occurs if the input has no value
// creation: input
// focus: focusin focus input
// blur: focusout input blur
var ignoreNextInput = !!$attrs.placeholder;
$element.on("focusin focusout", function(e) {
ignoreNextInput = !!(!this.value && this.placeholder);
});
$element.on("input", function(e) {
if (ignoreNextInput) {
e.stopImmediatePropagation(); //(stopImmediate is used so the ng-model listener never receives it)
ignoreNextInput = false;
}
});