如何在Angular2中停止observable.timer

Question

我在Angular2的Component中实现了以下功能:

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

我希望在Observable.timer正确存储值后停止重复setFormData().

但不知道怎么样,请告诉我.

Answer 1

基本上有两种方式:

• 调用unsubscribe()从subscribe()调用返回的Subscription对象.
• 使用运营商

只是unsubscribe,你可以不喜欢这样.

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

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

或者您可以使用Subject来完成Observable via takeUntil()运算符:

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()角度组件的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();