如何在密码删除字符后，去除确认密码输入的字符？

Question

我怎样才能在密码字段删除字符后，去除确认密码字段中键入字符？当你把一些字符密码字段，你将能够把一些字符在确认密码字段，但是当你清除密码字段中的字符在确认密码的字符保持和残疾人领域。

<div class="col-12">
    <div class="row mb-3">
        <div class="col-sm-4 ">
            <div class="input-container">
                <label for="Password">* Password</label>
            </div>
        </div>
        <div class="col-sm-8">
            <div class="input-container">
                <input name="password" id="Password" placeholder="Password" type="password" [(ngModel)]="SignUp.Password" pInputText required/>
                <br>
                <label for="Password" style="font-size: 15px"><i>At least 8 characters and must be a combination of letters and numbers.</i></label>
            </div>
        </div>
    </div>
</div>

<div class="col-12">
    <div class="row">
        <div class="col-sm-4">
            <div class="input-container">
                <label for="Confirm Password">* Confirm Password</label>
            </div>
        </div>
        <div class="col-sm-8 ">
            <div class="input-container">
                <input name="confirmpass" id="Confirm Password" [disabled]="!SignUp.Password" placeholder="Confirm Password" type="password" [(ngModel)]="SignUp.ConfirmPassword" pInputText required/>
            </div>
         </div>
     </div>
 </div>

[https://i.stack.imgur.com/hsDYI.png][1]

Answer 1

您可以使用类似(ngModelChange)="modelChanged($event)"这将帮助您监测模型值的变化。

<div class="col-12">
          <div class="row mb-3">
              <div class="col-sm-4 ">
                  <div class="input-container">
                      <label for="Password">* Password</label>
                  </div>
              </div>
              <div class="col-sm-8">
                  <div class="input-container">
                      <input name="password" id="Password" placeholder="Password" type="password" [(ngModel)]="SignUp.Password" pInputText required (ngModelChange)="SignUp.ConfirmPassword = null "/>
                      <br>
                      <label for="Password" style="font-size: 15px"><i>At least 8 characters and must be a combination of letters and numbers.</i></label>
                  </div>
              </div>
          </div>
      </div>

      <div class="col-12">
          <div class="row">
              <div class="col-sm-4">
                  <div class="input-container">
                      <label for="Confirm Password">* Confirm Password</label>
                  </div>
              </div>
              <div class="col-sm-8 ">
                  <div class="input-container">
                      <input name="confirmpass" id="Confirm Password" [disabled]="!SignUp.Password" placeholder="Confirm Password" type="password" [(ngModel)]="SignUp.ConfirmPassword" pInputText required/>
                  </div>
              </div>
          </div>
      </div>

Answer 2

如果你想这样做的，你可以使用这个模板：

<div class="col-12">
          <div class="row mb-3">
              <div class="col-sm-4 ">
                  <div class="input-container">
                      <label for="Password">* Password</label>
                  </div>
              </div>
              <div class="col-sm-8">
                  <div class="input-container">
                      <input name="password" id="Password" placeholder="Password" type="password" [(ngModel)]="SignUp.Password" (ngModelChange)="SignUp.ConfirmPassword=$event ? SignUp.ConfirmPassword :''" pInputText required (ngModelChange)="SignUp.ConfirmPassword = null "/>
                      <br>
                      <label for="Password" style="font-size: 15px"><i>At least 8 characters and must be a combination of letters and numbers.</i></label>
                  </div>
              </div>
          </div>
      </div>

      <div class="col-12">
          <div class="row">
              <div class="col-sm-4">
                  <div class="input-container">
                      <label for="Confirm Password">* Confirm Password</label>
                  </div>
              </div>
              <div class="col-sm-8 ">
                  <div class="input-container">
                      <input name="confirmpass" id="Confirm Password" [disabled]="!SignUp.Password" placeholder="Confirm Password" type="password" [(ngModel)]="SignUp.ConfirmPassword" pInputText required/>
                  </div>
              </div>
          </div>
      </div>