Problem with hiding tabs programmatically


In my app I have a tab component. All tabs are of the same page showing different content depending on the value of rootParams. All is working fine, until I’m trying to insert an undo functionality. The way I tried is working without any problems inside a list, but now I’m getting a problem within tabs:

  <ion-tab *ngFor="let tab of getActiveTabs()" [root]="tabRoot" [rootParams]=""></ion-tab>

The data object of the deleted tab is marked by data.deleted = true.

getActiveTabs() {
  return tabs.filter(tab => !tab.deleted);

Additional a toast with a closeButton is shown.

let toast = globalToastCtrl.create({
   message: ...
   duration: 5000,
   showCloseButton: true,
   closeButtonText: 'Undo',
   dissmissOnPageChange: false
toast.onDidDismiss(() => {

Setting data.deleted = true and if necessary delete data.deleted, if the undo button is clicked before the timeout is over is managed by a provider holding the deleted data in an stack.

After touching the delete button inside the tab the toast is getting shown, but I get the following error message:

Uncaught TypeError: Cannot read property 'length' of null
  at Tab.NavControllerBase.getActive (nav-controller-base.js:1102)
  at DeepLinker.pathFromNavs (deep-linker.js:297)
  at DeepLinker.navChange (deep-linker.js:209)
  at OverlayPortal.NavControllerBase._transitionFinish (nav-controller-base.js:774)
  at t.invoke (polyfills.js:3)
  at Object.onInvoke (ng_zone.js:273)
  at t.invoke (polyfills.js:3)
  at (polyfills.js:3)
  at (ng_zone.js:142)
  at Array.<anonymous> (nav-controller-base.js:706)
  at AlertMdPopOut.Animation._didFinish (animation.js:1091)
  at AlertMdPopOut.Animation._didFinishAll (animation.js:1077)
  at onTransitionEnd (animation.js:495)
  at HTMLElement.onTransitionEnd (platform.js:659)

The timer is going on and after it is over, the data of the tab is been deleted. But of course there’s no way to use the undo button.

The problem isn’t caused by my provider. If I set data.deleted = true in the code of the delete function - and not in the provider - I’m getting the same error.

Can you help me? Thanks in advance for your help!


Interesting problem. Looking at the error I can’t help but think that maybe it is because your filter in getActiveTabs() removes the tab you are currently on. Can you try switching to another tab before setting data.deleted = true and see if you still get an error?


@plmetz: Thanks for your answer. This seems to be the problem. Now I’m switching to another tab before setting data.deleted = true and it’s working.