首页 文章

Angular 2 RxJS可观察取消订阅submitForm

提问于
浏览 次
2

这可能是一个基本问题，但没有找到任何足够的答案 . 所以这就是为什么我想创造一个SO .

我有一个具有提交处理程序的表单 .

<form class="form login" [formGroup]="loginForm" (ngSubmit)="onSubmit()" novalidate>

在提交时，我调用一个订阅一个observable的函数，该函数执行对firebase的HTTP调用（使用AngularFire2库） .

public onSubmit() : void {
    const values = this.loginForm.value;

    let subscription = this.loginUsernamePassword(values.email, values.password).subscribe((data) => {
        this.processLogin(data);
    }, (error) => {
        console.log("erreur" + error);
    }, () => {
        console.log("one");
    });
}

现在假设我多次提交表单，然后创建多个订阅 . 我关心的是数据清理（取消订阅），但不知道处理这个问题的最佳方法是什么，特别是因为这是一次性功能 . 我看到两个解决方案 .

1）将订阅存储在订阅集合中，当删除组件时，订阅会被销毁“ngOnDestroy” . 但我认为对于这种情况：单个HTTP调用，这有点奇怪 .

2）在完成可观察性后立即取消订阅 .

3）..还有其他什么？

谢谢你的帮助和提示 .

angular rxjs observable

1 回答

  • 2

    处理组件中的长期订阅的一种方法是通过向订阅添加条件来确保它们被处置，如此...

    export class MyClass implements OnInit, OnDestroy {
  public isDestroyed = false;
  public someData: Observable<SomeData>;

  public ngOnInit() {
    this.someData = {some other source}
    .takeWhile(!this.isDestroyed)
    .subscribe(x => x...........);
  }

  public ngOnDestroy() {
    this.isDestroyed = true;
  }
}

    虽然我怀疑父观察可能会保留此订阅，直到 next 值传递，然后发现订阅者不再感兴趣 . 使用 takeUntil 可能更好，因为这需要一个Observable，你可以调用 next 来立即终止订阅 .

    在你的情况下，它实际上取决于this.loginUsernamePassword的作用 . 如果它是基于http调用的订阅，那么http创建的主题无论如何都将被销毁，然后您的本地订阅将随之消失 .

    回复于

相关问题