在Angular 4中单击取消时删除Loader

时间:2017-11-28 11:37:24

标签: angular loader angular-services angular-forms angular-observable

我有这个名为ngx-loading的npm包。我必须设置this.loading = true和this.loading = false以使其显示而不显示。当我在javascript中使用警报时出现问题。警报显示“确定”和“取消”。当我点击“确定”时加载器消失,而如果我点击“取消”和“x”它仍然出现?当我点击取消或x按钮时,如何让装载机消失?这是我在下面所做的。

  

TS

onUpdate(form: NgForm) {
  this.loading = true;

  name =  form.value.name,

  if (confirm('Are you sure you want to update?')) {
    this.subscription = this.prodService.update(name)
    .subscribe(
      data => {
       this.loading = false;
       console.log(data); 
     },
     error => {
       this.loading = false;
       console.log(error);
     });
  }
}

2 个答案:

答案 0 :(得分:1)

尝试以下方法:

onUpdate(form: NgForm) {
  this.loading = true;

  name =  form.value.name,
var _confirm = confirm('Are you sure you want to update?');
  if (_confirm ) {
    this.subscription = this.prodService.update(name)
    .subscribe(
      data => {
       this.loading = false;
       console.log(data); 
     },
     error => {
       this.loading = false;
       console.log(error);
     });
  }
else {
 this.loading = false;
}
}

答案 1 :(得分:1)

只需在用户点击取消时添加其他条件。

onUpdate(form: NgForm) {
  this.loading = true;

  name =  form.value.name,

  if (confirm('Are you sure you want to update?')) {
    this.subscription = this.prodService.update(name)
    .subscribe(
      data => {
       this.loading = false;
       console.log(data); 
     },
     error => {
       this.loading = false;
       console.log(error);
     });
  } else {
    this.loading = false;
  }
}