ion-affix: Sticky headers for Ionic framework

Inspired by Collin Donahue-Oponski initial idea shown in this gist and the fact that there was no implementation available for the current Ionic framework to make certain list headers sticky, I gave it a shot and created the small directive ion-affix.

Once installed via

npm install --save ion-affix

it has to be included in your app.module.ts:

To make any ion-list-header, ion-item-divider or ion-item (within ion-card) sticky you simply apply the ion-affix directive to it and pass a reference to the parent ion-content to it:


Demo: