在提交表单上可观察到的2个RxJS不可分字段

Question

这可能是一个基本的问题，但没有找到任何充分的答案。所以我觉得创造一个。

我有一个表单，它有一个提交处理程序。

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

3）..其他的吗？

谢谢你的帮助和提示。

Answer 1

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

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

虽然我怀疑父observable可能会保留这个订阅，直到next值传递出去，然后它发现订阅者不再感兴趣。使用takeuntil可能更好，因为这需要一个可观察的，您可以调用next来立即终止订阅。

但在您的情况下，这实际上取决于此.LoginUsernamePassword做了什么。如果它是基于http调用的订阅，那么http创建的主题无论如何都将被销毁，然后您的本地订阅也将随之消失。