We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

In tab component,if its tab item content(<ng-template #content></ng-template>) contains another angular component,it renders and destroy the component even before actual rendering.


Tab component used like below shown.
 <ejs-tab >
          <e-tabitems >
            <e-tabitem [header]='headerText[0]' >
              <ng-template #content>
                <up-phone></up-phone>(inner component which we included)

if we tested with ngOnDestroy() method in phone component ,it is called even before destroying.

case where i got the problem:
we are trying to remove the dialog(ejs-dialog using id) element which is included in component(<up-phone>) using onDestroy method of component(<up-phone>).
It is giving error because of its calling mechanism.

1 Reply

NR Nevitha Ravi Syncfusion Team August 19, 2019 11:35 AM UTC

Hi Goutham, 
Thanks for contacting Syncfusion support. 
We had checked your reported scenario at our end. Tab component is working properly while we render the dialog inside the tab as external component. When we destroy the tab component, before that we need to destroy the dialog component manually. ‘ngOnDestroy’ method is not invoked because we are destroying just tab component, not the angular component. When we destroy the angular component, in this case ‘ngOnDestroy’ method is invoked by default. The best example for destroying angular component is angular routing. While we switch from one component to another component the ‘ngOnDestroy’ method invokes properly. 

Kindly revert us, if we misunderstood your requirement or any other queries. 


Live Chat Icon For mobile
Up arrow icon