How to fix the position of a "Label" within a "List"?

ionic-v1
1

Hello, all:

I started using Ionic Framework less than a week ago, and have a small question to ask:

Is there a way to fix the position of a “Label” of a “List”. I have a long form that calculates some values, and I would like to give instant feedback to the user by keeping the “Label” that holds the final values fixed, while the remainder of the form scrolls. In the attached image, that label would be the part with the orange background.

I am using “ng-model” in the form, so I could not include this label outside of “ion-content”. Needless to say that I tried to include it in “bar-subheader”, but it did not work.

I will greatly appreciate any help on this matter.

2

I don’t think Ionic supports this at the moment, unfortunately.

The underlying issue is that the library that Ionic uses for ion-content and ion-scroll, the Zynga scroller, doesn’t support elements being ‘sticky’. This makes a number of things like sticky list headers not trivial to do.

I know the team is working on said sticky list headers, and I’m guessing that once those are in place, the groundwork will be there to make feature requests like yours easier to do.

3

Thanks for your answer, Coen. It is great to know that the Ionic team will add this feature in the future.

Have a nice day.