Angular 2 RxJS在submitForm上可观察取消订阅

问题描述：

这可能是一个基本问题，但没有找到足够的答案。所以这就是为什么我想创建一个SO。Angular 2 RxJS在submitForm上可观察取消订阅

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

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

在提交我调用哪个预订可观察到的一个功能，即执行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）oberservable完成后立即退出。

3）..其他？

感谢您的帮助和提示。在一个组件处理长期订阅

我强烈建议您阅读Ben Lesh [“RxJS：不要取消订阅”]（https://medium.com/@benlesh/rxjs-dont-unsubscribe-6753ed4fda87） –

答

的一种方法是，以确保他们加入的条件认购，像这样设...

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创建的主题将被销毁，然后您的本地订阅将随之消失。

Angular 2 RxJS在submitForm上可观察取消订阅

相关推荐