Tabs endless loading loop issue

[seanbotha123]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

Change tabs very quickly, each tab has large amounts of data to process. When switching between tabs too quickly the tabs go into an endless loop of loading.

What is the current behavior?

Goes into endless loading loop.

What are the steps to reproduce?

http://plnkr.co/edit/O85thWJeQ0stFAOtojBR

• open Plunker.
• run.
• click 'Click Me' button/ switch between tabs rapidly.
• loop.

I need to have a ngIf on my components to remove them from the DOM if the tab is not selected. Found the issue where a user was switching tabs quickly and the previous tabs were still loading.

Edit: I see this even happens when not using ngIf. http://plnkr.co/edit/bu2iWvGifGHs95JswBzL

[jelbourn]

@andrewseguin looked at the plunker, definitely something weird going on

[seanbotha123]

Hi guys,

Any feedback here yet?

[james-schwartzkopf]

I believe we are seeing the same issue. In our case were are trying to store the active tab in ngrx/store. Things work as expected as long as you switch tabs slowly, but if you change quickly it seems to get stuck in a loop.

It looks like the issue is multiple events piling up in the queue for the async selectChange event emitter?

Edit: I have found I can work around the issue by adding this check at the front of my selectIndexChange event handler: if (this.tabGroup.selectedIndex !== tabIndex) { return; }

[amcdnl]

Here is a updated plunker - http://plnkr.co/edit/UTgPtgPIKuHScfQKpVFp?p=preview

[finalxcode]

mark

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}