ActionItem with *ngIf throws an error when it's removed

[tsonevn]

From @madakk on August 13, 2017 10:54

Looks like this is happening because ActionItems.removeItems calls _removeView directly: https://github.com/NativeScript/NativeScript/blob/12020bd8bbdb8d87f9100d713590d0db982b7661/tns-core-modules/ui/action-bar/action-bar-common.ts#L190

But the nativescript angular handler has already removed the view (due to the same *ngIf directive) causing the error.

I believe this can be fixed by simply checking that the item's parent is actually the actionBar before attempting to remove it.

Copied from original issue: NativeScript/NativeScript#4691

[NickIliev]

@madakk I have created this test application where an ActionItem is removed/added using *ngIf structural directive. It works as expected on both iOS and Android.

In order to investigate your specific case please provid3e more information and sample code base that can reproduce the issue you are struggling with.

[madakk]

I'm sorry, I failed to notice this in my original report, this only happens when the ActionItem is provided inside an ActionBarExtension. It does appear to work properly with an ActionBar instance, as you've demonstrated.

Simply change the ActionBar to an ActionBarExtension in your testcase, and you should be able to reproduce.

Edit: Further investigation shows that the difference is that ActionBar preempts the view removal with its meta, calling removeItem instead, whereas ActionBarExtension handles the removal after it's already been removed from view, in its onActionDestroy handler.

[m-abs]

I think I just ran into the same issue without ActionBarExtension.
I was running the iOS9 simulator.
I don't see the problem on the iOS 10.3+ simulator.

I don't have a demo project to reproduce it, but our template looks like this:

<ActionBar>
   <ActionItem
     *ngIf="(tabs.activeComponent | async) == 'bookshelf'"
     (tap)="toSettings()"
     icon="res://settings"
     ios.position="right"
     [text]="'SETTINGS' | translate"></ActionItem>     
</ActionBar>

[sis0k0]

I'm closing this in favor of #978. @m-abs, I think that's another problem because it's related to the ActionBar and is iOS specific. Can you please open another issue with that sample, error log and any other information related to it?