如何在angular2中清除密码

这里我上传了我的html和ts页面。这段代码的逻辑是当我们点击删除操作的删除按钮时，会显示一条弹出消息，我们想输入密码来删除特定字段，当我点击按钮删除某个字段时，我遇到了一个问题，该字段被删除，但删除另一个字段时会再次显示相同的密码。请给我一个正确的解决方案。谢谢

        HTML
        <button type="button"
                                            class="btn btn-outline-danger btn-sm icmn-bin" 
                                            data-toggle="modal" data-name="{{source_info.source.name}}"  
                                            [attr.data-target]="'#delete_modal_' + source_info.source.name"  (click)="clear()"
                                            *ngIf="source_info.source.assigned ===  false"></button>  


    <!--  bootstrap modal starts -->
                                    <div class="modal fade modal-size-small delete-modal" id="delete_modal_{{source_info.source.name}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
                                        <div class="modal-dialog" role="document">
                                            <div class="modal-content">
                                                <div class="modal-header">
                                                    <h5 class="modal-title" id="myModalLabel">Are You Sure to
                                                        Delete ?</h5>
                                                    <button data-dismiss="modal" type="button">
                                                        <span aria-hidden="true">&times;</span>
                                                    </button>
                                                </div>
                                                <div class="modal-body">
                                                    <div class="row">
                                                        <div class="col">
                                                            <div class="form-group">
                                                                <h6>Enter Your password to confirm Delete <strong>{{source_info.source.name}}</strong></h6>
                                                                <input class="form-control input-pos" name="password" 
                                                                    [(ngModel)]="password" type="password" />
                                                            </div>
                                                            <div class="form-group pull-right">
                                                            <!--    <button class="btn btn-primary btn-sm" data-dismiss="modal"
                                                                    type="button">Cancel</button>  -->
                                                                <button class="btn btn-danger btn-sm"
                                                                    (click)="name=source_info.source.name;deleteSource(name, password)">Delete</button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!--  bootstrap modal ends -->

TS
  deleteSource(name, password) {
    const headers = new Headers({'Authorization': localStorage.getItem('Token'), 'Content-Type': 'application/json'});
    const options = new RequestOptions({headers: headers});
    console.log(name, password);

    $('.delete-modal').modal('hide');
    if (password === localStorage.getItem('Password')) {
      this.service.delete(options, services.data_source_service + name).subscribe((response) => {
        this.message.handle('icmn-checkmark', '', 'Data source has been deleted', 'success');
        this.getSources();
      }, (err) => {
        this.message.errorHandler(err);
      })
    } else {
      this.password = '';
      $.notify({
        message: 'Password not valid for delete operation!'
      },
        {
          type: 'warning'
        })
    }
  }

HTML
你确定要吗
删去
&时代；
输入密码以确认删除{{source\u info.source.name}
删去
TS
deleteSource（名称、密码）{
const headers=新的头（{'Authorization'：localStorage.getItem（'Token'），'Content Type'：'application/json'}）；
const options=newrequestoptions（{headers:headers}）；
console.log（名称、密码）；
$（'.delete modal'）.modal（'hide'）；
如果（密码===localStorage.getItem（'password'））{
this.service.delete（选项，services.data\u source\u service+name）.subscribe（（响应）=>{
this.message.handle（'icmn-checkmark'，''，'数据源已被删除'，'success'）；
这是getSources（）；
}，（错误）=>{
this.message.errorHandler（err）；
})
}否则{
this.password=''；
美元。通知({
消息：“密码对删除操作无效！”
},
{
类型：“警告”
})
}
}

如果我理解正确，您需要在模式中输入密码以清除数据源。输入密码并删除数据源后，密码字段应再次为空，因此您必须在下次删除时再次输入密码，但如果输入一次密码，它将保留在字段中，并且在删除操作后不会被清除

解决方案是在

.ts

文件中只添加一行代码。删除操作成功后，必须将密码设置回空字符串。这必须在

subscribe

函数中完成

if (password === localStorage.getItem('Password')) {
  this.service.delete(options, services.data_source_service + name).subscribe((response) => {
    this.message.handle('icmn-checkmark', '', 'Data source has been deleted', 'success');
    this.getSources();

    // SET PASSWORD TO EMPTY STRING HERE
    this.password = '';
  }, (err) => {
    this.message.errorHandler(err);
  })
} else {
  this.password = '';
  $.notify({
    message: 'Password not valid for delete operation!'
  },
    {
      type: 'warning'
    })
}

onModalClose(){
    this.password='';
}

每次成功删除后，在尝试删除下一个数据时，密码字段应再次为空

编辑-关闭时清除密码 现在，当我们关闭模式而不按下按钮时，密码字段仍将被填充。所以，当我们按下关闭按钮时，我们必须做同样的事情。我们可以在这个按钮上添加一个功能，当按下时将执行该功能

<button data-dismiss="modal" type="button" (click)="onModalClose()">
    <span aria-hidden="true">&times;</span>
</button>

---

我不能100%确定这个函数是否会覆盖dismise函数，但我认为它应该同时完成这两个功能，关闭模式和执行

onModalClose

您可能可以在

this.service.delete（…）.subscribe（…）

，就像这样

this.password='',，因此，当删除成功时，它会被重置为空字符串。作为一个新的字符串，我不知道如何为此编写代码。请您按照我们需要的正确格式更改上述代码。事实上，我按照您所说的做了，但它在所有设备的移动视图中都不起作用。您能给出一些解决方案吗？我已经向您发送了我的屏幕截图。你的想法适用于桌面视图，但它不能在所有设备的移动视图中工作。如果没有任何进一步的信息，我无法帮助你，对不起。Angular不关心移动或桌面视图，如果您编写了类似将字符串设置为空值这样简单的代码，则这两种方法都应该适用，除非发生其他情况。您的代码在移动视图和桌面视图之间是否有任何不同，是否有只为一个视图执行的代码？您是否确定只有在按下“删除”按钮时才会发生这种情况？例如，当您只关闭模式而不删除时，您的密码可能仍会被输入。当您只关闭模式而不删除时，密码可能仍会被输入。是的，这是我们的问题，但它在数据表列表视图的移动视图中不起作用。实际上，这里我们使用的是jquery数据表。是否由于使用这个jquery，我们的问题在移动视图中没有得到解决？