How To Turn Autocomplete Off In Angular Using Formbuilder

When I open a dialog that contains two fields, password and confirmpassword, they are always autofilled which results in the form validation throwing an error. I have set the autoc

Solution 1:

According to MDN documentation we can read that:

If a site sets autocomplete="off" for a , and the form includes username and password input fields, then the browser still offers to remember this login, and if the user agrees, the browser will autofill those fields the next time the user visits the page. If a site sets autocomplete="off" for username and password fields, then the browser still offers to remember this login, and if the user agrees, the browser will autofill those fields the next time the user visits the page.

One solution is to pass autocomplete="new-password" to the input because modern browsers have stopped autofilling <input> elements with autocomplete="new-password". So try this:

<mat-form-field class="form-field">
        <mat-label>Password</mat-label><input #passwordInputmatInputformControlName="password"type="password"class="form-control"matTooltip="{{passToolTip}}" [(ngModel)]="password"requiredautofocusautocomplete="new-password"><mat-error *ngIf="passwordForm.controls.password.touched && passwordForm.controls.password.invalid"><span *ngIf="passwordForm.controls.password.errors.required">This field is mandatory.</span><span *ngIf="passwordForm.controls.password.errors.minlength">At least 8 characters
                long</span></mat-error></mat-form-field><mat-form-fieldclass="form-field"><mat-label>Confirm Password</mat-label><inputmatInputformControlName="confirmPassword"type="password"class="form-control"
            [(ngModel)]="confirmPassword"requiredautocomplete="new-password"><mat-error
            *ngIf="passwordForm.controls.confirmPassword.touched && passwordForm.controls.confirmPassword.invalid"><span *ngIf="passwordForm.controls.confirmPassword.errors.required">This field is
                mandatory.</span><span *ngIf="passwordForm.controls.confirmPassword.errors.mustMatch">Passwords do not
                match</span></mat-error></mat-form-field>

If this don't help you to resolve your issue may be you can find some answers in this Gist Page