Replace component with its content when using custom components


Lets assume i want a custom component to have the content of a ion-menu.

<sidemenu></sidemenu> //this sidemenu will hold the

<ion-nav id="nav"

The sidemenu template is something like this:

<ion-menu [content]="content">
        <ion-title>{{ 'HELLO' | translate }}</ion-title>

            <button ion-item
                    *ngFor="let p of DataMenu"

But this will render the following html, breaking the menu navigation, css, etc… making the menu not to open.


It’s not possible to replace the component with the template content?
How can a create custom components around the ionic components?

Can someone help me?

Any thoughts?

I still have some problems with this… If I create a component around an ionic component it breaks the “chaining” and CSS around it.

Don’t know the best approach.

How can I do something like this?

Anyone? Can someone help me?

I don’t know how to do this… or create any custom component around ionic.


I think you have to read :


and if you have an understanding tell me.