Slide-box with dynamic content and fixed slide dimensions


#1

Hi,
How do I configure a slidebox (which has dynamic content), so that each slide always has the same dimensions?

I need this because I would like to avoid running the $ionicSlideBoxDelegate.update() method on each slide change.

The content of each slide will always be html formatted text, but I’ve been having trouble with making the content scrollable when using the ng-bind-html directive, so any pointers as to how this is solved are also welcome.

Thanks


#2

I’ve created a pen to illustrate the issue with vertical scrolling that I’m experiencing:

When using ng-bind-html there is no scrolling. Removing it and inserting a hardcoded string between the scroll tags makes the content scrollable. Am I doing it wrong or is it in fact a bug?


#3

It appears that when using the ng-bind-html, an inner div with class=scroll is not inserted. So an easy work-around in my case is to just add the div between the ion-scroll tags, and then set the ng-bind-html directive on this instead. Like this:

> <ion-scroll         
>         direction="y" 
>         style="height:300px" 
>         scroll="true" 
>       >
>     <div ng-bind-html="item.body"></div>
> </ion-scroll>

#4

It is not working the scrollbar is appearing separately with empty content and ng-bind comes after scrollbar


#5
 <ion-scroll direction="y" style="height:95vh;width: 100vh;" scroll="true">
            <span ng-bind-html="sceData"></span>
 </ion-scroll>

This worked for me