How to prevent IE11/10/9 from triggering automatically input validation?

I’m submitting a … (check one with “x”)

[ x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

<md-dialog-content> <form [formGroup]="privilegeForm"> <md-input-container class="account-login-material" style="width: 100%"> <input mdInput required placeholder="Name" formControlName="name" [(ngModel)]="name" maxlength="16"> <md-hint align="start" *ngIf="privilegeForm.name.valid || privilegeForm.name.pristine">Name is required</md-hint> <md-hint align="end">{{name?.length}} / 16</md-hint> </md-input-container> </form> </md-dialog-content>

when i use placeholder="Name" in IE11/10/9, I get the message “Name is required” is diplayed as soon as the field gets focus.

Expected behavior

i expect that there is a method to prevent IE11/10/9 from triggering automatically input validation?

Minimal reproduction of the problem with instructions

none

What is the motivation / use case for changing the behavior?

when this input field is pristine and valid, the message “required” should not be displayed

Please tell us about your environment:

@angular/cli: 1.0.0-beta.31 node: 6.9.4 os: win32 x64

• Angular version: 2.0.X

@angular/common: 2.4.8 @angular/compiler: 2.4.8 @angular/core: 2.4.8 @angular/forms: 2.4.8 @angular/http: 2.4.8 @angular/material: 2.0.0-beta.2 @angular/platform-browser: 2.4.8 @angular/platform-browser-dynamic: 2.4.8 @angular/router: 3.4.8 @angular/cli: 1.0.0-beta.31 @angular/compiler-cli: 2.4.8

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

IE11/10/9

• Language: [all | TypeScript X.X | ES6/7 | ES5] ES5

• Node (for AoT issues): node --version =
  node: 6.9.4

[GZidar]

This may not be a bug in Angular but it is something that perhaps should be fixed by Angular so that workarounds are not needed in all client applications. A similar issue was discussed (and supposedly fixed) in Angular JS.

https://github.com/angular/angular.js/issues/2614

Put simply the input form field is marked as dirty immediately upon receiving focus rather than waiting for the user to enter a value.

The page loads, user tabs onto an input and the control is immediately set to dirty. In Edge, Chrome, and Firefox this is not the case. This difference of behaviour is the “bug”.

[muziekklas]

Any update on this issue? Is there a similar patch as in AngularJS?