javascript - 如何在 Angular2 中停止 observable.timer

标签 javascript angular typescript rxjs rxjs5

我正在 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 的重复。

但是不知道怎么做,请告诉我。

最佳答案

基本上有两种方式:

  • subscribe() 调用返回的订阅对象调用 unsubscribe()
  • 使用运算符(operator)

取消订阅,您可以这样做。

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

也看看这些:

2019 年 1 月:针对 RxJS 6 进行了更新

关于javascript - 如何在 Angular2 中停止 observable.timer,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44039278/

相关文章:

javascript - DOM 元素添加到 DOM 树后是否立即可用?

javascript - Canvas :动画一个简单的星空

Angular 6 : How to make a set of service calls in parallel and process Data once all of them are completed

angular - 选择后清除 Angular Material 自动完成

javascript - Angular DI 注入(inject)的 super 代理的正确类型是什么?

reactjs - 带有反应 Spring 的 typescript 。类型 'interpolate' 上不存在属性 'number'

javascript - tsconfig 中的模块选项是用来做什么的?

javascript - 将 Prettyjson 与 Typescript 一起使用时出错

javascript - 如何在vue中单击按钮时从数组中获取对象

javascript - 这个 reducer 中的 return { ...state, } 到底是什么意思?