Angular2 - 在 routerOnDeactivate() 中停止/取消/清除可观察到的

Question

我是 Angular2 的新手，如果这是一个微不足道的问题，我深表歉意。当我点击另一个 link 时，我似乎无法停止间隔。该组件每 3.5 秒从 DB table 获取数据，并用作聊天，因此 100 个用户可以随时添加。我不希望它一直在后台运行，所以我想我会使用 routeronDeactivate() 函数让它在用户处于不同的 link 时停止。

我觉得我做错了什么。谁能帮帮我？

export class FeedComponent {

    public feeditems: Feed[];
    public timer;


    constructor(private _feedService: FeedService) {
    }

    getArticlesJSON() {

        console.log('getArticlesJSON');
        this._feedService.getFeedJSON()
            .subscribe(
                data => this.feeditems = data,
                err => console.log(err),
                () => console.log('Completed')
            );
    }

    routerOnDeactivate() {

        // this.timer.remove();
        // this.timer.dematerialize();
        // clearInterval(this.timer);

        console.log('-- deactivate ');
        // console.log('-- deactivate ' + JSON.stringify(this.timer));
    }

    routerOnActivate() {

        this.timer = Observable.timer(5000,3500);
        this.timer.subscribe(() => {
            this.getArticlesJSON();
        });

        console.log('++ activate ' + JSON.stringify(this.timer));
    }
}

Answer 1

routerOnActivate() {
  this.timer = Observable.timer(5000,3500);
  this.subscription = this.timer.subscribe(() => {
    this.getArticlesJSON();
  });
}

routerOnDeactivate() {
  this.subscription.unsubscribe();
}

Angular2 - 在 routerOnDeactivate() 中停止/取消/清除可观察到的

Angular2 - stop / cancel / clear observable in routerOnDeactivate()

service

observable

angular