如何在 Angular2 中停止 observable.timer

Question

我正在 Angular2 的组件中实现以下功能：

export class MypageEditComponent {

  ngOnInit() {
    this.timer = Observable.timer(100, 100);
    this.timer.subscribe(t => {
      this.setFormData();
  }


  private setFormData() {
    this.editUserAcountType = this.authStore.registerInfo.account_type;
    this.editAddress = this.authStore.registerInfo.email;
    this.editUserName = this.authStore.registerInfo.username;
  }
}

一旦使用setFormData()正确存储值，我想停止Observable.timer的重复。

但不知道如何，请告诉我。

Answer 1

基本上有两种方式：

• 对从subscribe()调用返回的 Subscription 对象调用unsubscribe() 。
• 使用运算符

要unsubscribe您可以这样做。

ngOnInit() {
  this.subscription = timer(100, 100).subscribe(t => {
    this.setFormData();
  });
}

private setFormData() {
  ...
  this.subscription.unsubscribe();
}

或者你可以使用 Subject 通过takeUntil()操作符来完成 Observable：

this.subject = new Subject();

ngOnInit() {
  timer(100, 100).pipe(
    takeUntil(this.subject),
  ).subscribe(t => this.setFormData());
}

private setFormData() {
  ...
  this.subject.next();
}

看看这些：

• .unsubscribe 和 .take(1) 的区别
• RxJS：takeUntil() Angular 组件的 ngOnDestroy()

2019 年 1 月：针对 RxJS 6 更新

Answer 2

当您想像这样停止可观察的计时器时，您可以使用unsubscribe方法

this.timer = Observable.timer(100, 100);
this.subscription = this.timer.subscribe(t => {
    this.setFormData();
});

.............
this.subscription.unsubscribe();

Answer 3

以前的答案没有真正涵盖的一个细微差别是，不需要停止可观察的计时器/间隔 - 至少不需要与可观察的或计时器本身进行交互。

我发现自己在这里是因为我在 HostedService 的 start 方法中使用计时器设置了一个 observable，而在 stop 方法中，我似乎应该停止它，或者肯定地处理一些东西？ - 嗯……不。 observable timer 不需要以这种方式停止或处理，只需要订阅，这就是为什么......

可观察的计时器和间隔是冷流的例子（尽管它们看起来像热流）。 它们是被动的而不是主动的，它们在订阅之前不会产生数据，并且在没有订阅者时停止产生数据。 因此，处理所有订阅应该是停止计时器生成数据所需的全部内容。

更多信息在这里... [ http://introtorx.com/Content/v1.0.10621.0/14_HotAndColdObservables.html]

Answer 4

xD 你知道你可以做出承诺吗？

import { timer } from 'rxjs';

timer(1000).toPromise().then(res => {
      //code here  
})

无需处理退订。

Answer 5

-- 解决方法

setTimeout(() => observable.next(null) , 2000);