angular 4 reactive forms with material 2, disabling autocomplete

问题

I'm using angular cli, angular 4 and angular material 2. I need to disable chrome autocomplete, but I'm not being able to do so.

I already searched and found out that I need to add autocomplete=off or autocomplete=false both in the form and the input. I've also found a workaround by adding type="search". None of them seems to work.

Is material or angular overrinding this instructions?

I'm using reactive forms!

Any sugestions?

Thanks in advance by your help

回答1:

Chrome no longer supports autocomplete="off" (Chrome stopped supporting this in 34.0). Instead, use autocomplete="new-password" instead. You can check out Mozilla's documentation on this here

From the documentation:

For this reason, many modern browsers do not support autocomplete="off" for login fields:

If a site sets autocomplete="off" for username and password input fields, then the browser will still offer to remember this login, and if the user agrees, the browser will autofill those fields the next time the user visits the page. This is the behavior in Firefox (since version 38), Google Chrome (since 34), and Internet Explorer (since version 11).

If an author would like to prevent the autofilling of password fields in user management pages where a user can specify a new password for someone other than themself, autocomplete="new-password" should be specified, though support for this has not been implemented in all browsers yet.

Example:

<mat-form-field *ngIf="filter.editorType==='text'">
    <input matInput autocomplete="new-password"
    [formControlName]="filter.id" 
    [placeholder]="filter.name" 
    (keyup.enter)="onApplyFiltersKeyboard()">
</mat-form-field>

来源：https://stackoverflow.com/questions/48010470/angular-4-reactive-forms-with-material-2-disabling-autocomplete