Question 45311 in Html Question posted in
Some basic documentation can be found here.

how to prevent navigator to insert data into input html angular

I have two input fields that take values automatically from the browser in my Angular project, I tried with the option HTML autocompete, but it’s not changed.
this is my HTML Code:

 <div class='name' *ngIf="COMPTE_FRANCAIS==true">

            <input type="text" autocomplete="off" [(ngModel)]="driver.loginAm"
              [placeholder]="'DRIVERS.FORM.LOGIN' | translate" [matTooltip]="'DRIVERS.FORM.LOGIN' | translate">
            <input type="password" autocomplete="off" [(ngModel)]="driver.pwdAm"
              [placeholder]="'DRIVERS.FORM.PWD' | translate" [matTooltip]="'DRIVERS.FORM.PWD' | translate">

            <a href="https://authps-espacepro.ameli.fr/" target="_blank" rel="noopener noreferrer"
              style="margin-top: auto;">
              <button class="btn btn-ameli">
                <img src="./../../../../assets/img/ameli.png">
              </button>
            </a>

      </div>

and this is a screenshot for the problem:
screenshot

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    the solution is to add new-password to the autocomplete in the password input

    <input type="password" autocomplete="new-password" [(ngModel)]="driver.pwdAm"
              [placeholder]="'DRIVERS.FORM.PWD' | translate" [matTooltip]="'DRIVERS.FORM.PWD' | translate">

  2. 0

    You need to add fake input fields to allow that browser use that fake fields and you continuous using yours correctly.

    <div class='name' *ngIf="COMPTE_FRANCAIS==true">

    <!--  fake fields are a workaround for chrome/opera autofill getting the wrong fields -->
    <input id="username" style="display:none" type="text" name="fakeusernameremembered">
    <input id="password" style="display:none" type="password" name="fakepasswordremembered">

    <input type="text" autocomplete="off" [(ngModel)]="driver.loginAm"
      [placeholder]="'DRIVERS.FORM.LOGIN' | translate" [matTooltip]="'DRIVERS.FORM.LOGIN' | translate">
    <input type="password" autocomplete="off" [(ngModel)]="driver.pwdAm"
      [placeholder]="'DRIVERS.FORM.PWD' | translate" [matTooltip]="'DRIVERS.FORM.PWD' | translate">

    <a href="https://authps-espacepro.ameli.fr/" target="_blank" rel="noopener noreferrer"
      style="margin-top: auto;">
      <button class="btn btn-ameli">
        <img src="./../../../../assets/img/ameli.png">
      </button>
    </a>

</div>

    Let me know if this works for you

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search