I've been trying to disable autocomplete by setting it to "false" ("/nope/no/new-password").
Even after attempting to use formControl and FormGroup along with a directive that sets the property to false using the native element, I still haven't found a solution to disable autocomplete/autofill.
Is there a way to change browser settings at the script level to turn off auto suggestions/autofill?
I've put in a lot of effort but haven't been successful. Below is the code I've used at both the form and directive levels:
<form [formGroup]="loginForm" autocomplete="off">
<input matInput placeholder="Username" formControlName="username" autocomplete="off">
<input matInput type="password" formControlName="password" autocomplete="new-password">
</form>
import { Directive, ElementRef } from '@angular/core';
@Directive({
selector: '[autocompleteOff]'
})
export class AutocompleteOffDirective {
constructor(private _el: ElementRef) {
let w: any = window;
let isChrome = w.chrome;
if (isChrome) {
this._el.nativeElement.setAttribute('autocomplete', 'off');
this._el.nativeElement.setAttribute('autocorrect', 'off');
this._el.nativeElement.setAttribute('autocapitalize', 'none');
this._el.nativeElement.setAttribute('spellcheck', 'false');
}
}
}