Question

在Angular 7应用程序中，我结合了一些众所周知的良好实践和模式。其中一些是 OnPush 更改检测， takeUntil模式以便从Observables退订，我尝试尽可能多地使用 Async Pipe ，因此Angular会照顾大多数人的东西。

所以我的组件通常是这样的：

在 my.component.ts

中

data$: Observable<MyObject>;

ngOnInit() {
  this.data$ = this.myService.loadData().pipe(shareReplay());
}

在模板中：

<ng-template #myLoader>Loading...</ng-template>
<div *ngIf="(data$ | async) as data; else myLoader">
  {{ data.label }}
</div>

因此，我不需要为 takeUntil 模式添加单独的主题。但是，如果我有一个“编辑/更新”表单，并且我加载了数据以填写该表单。然后，我需要将输入的数据保存在表单提交中，然后再次进行HTTP调用。成功后，我需要页面重定向，因此通常我要做的是订阅可观察对象并在那里重定向。因此，如果我要订阅，则需要退订，然后再次回到 takeUntil ：

private unsubscribe$: Subject<any> = new Subject<any>();

ngOnDestroy(): void {
  this.unsubscribe$.next(null);
  this.unsubscribe$.unsubscribe();
}

submit(value) {
  this.myService
    .update(value)
    .pipe(takeUntil(this.unsubscribe$))
    .subscribe(_ => this.router.navigate(['/somewhere']));
}

有没有一种方法可以完全消除对 takeUntil 的需求，而只需使用异步管道。我理想的情况是在 ngSubmit 中添加异步管道，如下所示：

<form (ngSubmit)="submit(value) | async">

但是由于不可能，还有另一种方法吗？

一些相关资源：

Answer 1

有趣的事实。如果使用Angular提供的HttpClient，则无需取消订阅。收到响应后，它将调用complete（）方法。

如何在不使用Angular提交表单的情况下创建/更新项目

1 个答案: