Angular2/4 : Refresh Data Realtime

I need to refresh the data in a component page in an interval. Also I need to refresh the data after doing some action. I am using Obeservables in the service so that I can subscribe to when the response is ready. I am pushing the subscriptions to a object so that I can clear that on ngDestroy, I think, I have the following methods to achieve the same.

Method 1 : setInterval

I have set an interval on ngOnInit, which will call the refreshData in equal interval. The interval object will be cleared using clearInterval in ngOnDestroy method.

export class MyComponent implements OnInit, OnDestroy {
    private subscription: Subscription = new Subscription();

    data: any;
    interval: any;

    ngOnInit() {
        this.refreshData();
        this.interval = setInterval(() => { 
            this.refreshData(); 
        }, 5000);
    }

    ngOnDestroy() {
        this.subscription.unsubscribe();
        clearInterval(this.interval);
    }

    refreshData(){
        this.subscription.add(
            this.myService.getData()
                .subscribe(data => {
                    this.data = data;
                })
        );
    }

    doAction(){
        this.subscription.add(
            this.myService.doAction()
                .subscribe(result => {
                    if(result === true){
                        this.refreshData();
                    }
                })
        );
    }
}

Q1 : On each refresh call a subscription will be added to the subscription object, will that increase the memory usage and may crash the browser if user keeps the page opened for a while?

Method2 : Observable.timer

This method is using a timer which will created after the data is refreshed.

export class MyComponent implements OnInit, OnDestroy {
    private subscription: Subscription = new Subscription();

    data: any;

    ngOnInit() {
        this.refreshData();
    }

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

    refreshData(){
        this.subscription.add(
            this.myService.getData()
                .subscribe(data => {
                    this.data = data;
                    this.subscribeToData();
                })
        );
    }

    subscribeToData(){
        this.subscription.add(
            Observable.timer(10000).subscribe(() => this.refreshData())
        );
    }

    doAction(){
        this.subscription.add(
            this.myService.doAction()
                .subscribe(result => {
                    if(result === true){
                        this.refreshData();
                    }
                })
        );
    }
}

Q2 : I have the same question(Q1) here. This way, will add the timers also to the subscription object, so infact the subscriptions in the subscription object is doubled.

Q3 : To refresh data after the action method - doAction(), the refreshData is called. So will that create another chain of timer?

Q4 : Which is the better way without memory leaks or if there exists any other way?