angular4-forms - Angular 4 与 Material 2 的 react 形式，禁用自动完成

Question

我正在使用 Angular cli、Angular 4 和 Angular Material 2。我需要禁用 chrome 自动完成功能，但我无法执行此操作。

我已经搜索并发现我需要在表单和输入中添加 autocomplete=off 或 autocomplete=false 。我还通过添加 type="search"找到了解决方法。它们似乎都不起作用。

Material 或角度是否凌驾于本说明之上？

我正在使用响应式(Reactive)表单!

有什么建议吗？

预先感谢您的帮助

Answer 1

Chrome 不再支持 autocomplete="off"(Chrome 在 34.0 中停止支持此功能)。请改用 autocomplete="new-password"。 你可以查看 Mozilla 的文档 here

来自文档:

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.

示例:

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