Ionic page - template inheritance

Ionic Framework ionic-v3
1

Hi ionics,

I want to use inheritance in pages.
In all searches I made, I can only see examples of pages inheritance which demonstrates reuse of the base page ts class code, in the child page. (e.g. properties, functions etc.)

I didn’t find an example of reuse of the base class template in the child page and I would like to know if that’s possible to make. I saw that in all examples, the base page template is null. (templateUrl: null.)

For example, implementing header & footer in the base page template, and all child pages inserts their own content template which will be merged with the base template.

The purpose is to avoid copy pasting the base content in each page. (in this example, the header & the footer).

Thanks.

2

Why can’t you just put that common stuff in app.html?

3

Yes, as of Angular 4. So you can’t do it in Ionic 1 for example. I don’t do it myself, though, because I think it’s a sketchy practice. It seems more future-thinking to me to define components (Angular components or web components) and plug them into pages as needed, so the html for a page is simple and short.