在 Angular 4 中单击取消时删除加载程序

Question

我有一个名为 ngx-loading 的 npm 包。我必须设置 this.loading = true 和 this.loading = false 以使其显示和不显示。当我在 javascript 中使用警报时，问题就来了。警报显示 "ok" 和 "cancel"。当我点击 "ok" 时加载程序消失，而如果我点击 "cancel" 和 "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);
     });
  }
}

Answer 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;
}
}

Answer 2

只需在用户单击取消时添加一个 else 条件。

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;
  }
}

在 Angular 4 中单击取消时删除加载程序

Remove Loader in When Click Cancel in Angular 4

loader

angular-services

angular

angular-observable

angular-forms