CODEWITHSUNDEEP
angulargoogle-chromeangular6angular7
AngularM
AngularM

Reputation: 16648

In Angular 7 - how can I disabled chrome auto fill and manage password select list

In Angular 7 - how can I disabled chrome auto fill and manage password select list?

Things I've tried:

This is my form:

<form class="col-12" [formGroup]="form" autocomplete="off" (ngSubmit)="onSubmit()">

  <label>Email*</label>
  <input type="email" formControlName="email" placeholder="" class="col-12 mb1 field">    

  <label>Password*</label>
  <input type="password" formControlName="password" placeholder="" class="col-12 mb1 field">

  <label>Confirm Password*</label>
  <input type="password" formControlName="confirmPassword" class="col-12 mb2 field">


  <button type="submit" [disabled]="!form.valid" class="btn btn-primary col-12" prevent-double-submit>Get Started</button>
</form>

Upvotes: 0

Views: 3162

Answers (2)

westdabestdb
westdabestdb

Reputation: 4648

you can solve this issue by 2 ways,

1) Set autocomplete=null in your HTML.

2) If you are not interested in using null in HTML, you need to create a directive.

ng g d Autocomplete

and modify AutocompleteDirective class as following:

private element: HTMLInputElement;
  constructor(private elRef: ElementRef) {
  this.element = elRef.nativeElement;
}
ngOnInit() {
  this.element.autocomplete = null //this will override default autocomplete.
}

and in your template:

<input appAutocomplete type="email" formControlName="email" placeholder="" class="col-12 mb1 field">

Upvotes: 1

Mile Mijatović
Mile Mijatović

Reputation: 3177

Try with this old but effective solution - autocomplete="new-password"

Chromium Issue 370363 reference

Stack overflow reference

Upvotes: 2

Related Questions