Slidebox lost all height using android device

HI everyone

When I run app on my android device I see none of my slides.
I inspected the code using chrome inspect device tools and discovered the slidebox has zero height.

Using the tools if I add 600px height then all slides appear on top of each other.
I have two screenshots of my chrome console.
The first shows the display on load, the second after I have manually added height of 600px.

To assist I have tested ionic 1.0.0 & 1.1 (latest).
Between each update I have also (just to be cautious) removed and reinstalled android platform.

The device I am using is a samsung note 4 using 5.0.1 using chrome 46.0.2490.76

The slider was working just fine until I updated my ionic CLI and ran ionic lib update,
which is why I tried rolling back my ionic to previous version!

I have also tried out several different code fixes found by reading threads in different pages.

  • $ionicSlideBoxDelegate.update();
  • adding ng-ini to slidebox then calling above update() func
  • add timeout of 2 seconds and auto call update() func
  • adding fixed CSS height to slides

Nothing works and I desperately need some help from anyone who can shed some light on my issue




I have just run this in my browser using ionic serve and firefox is showing the same issue so I don’t think this is a chrome specific issue.

I have also made the slidebox totally static i.e. removes all my ng-repeat regions and filled three slides with text on page.
still not working

====================== FURTHER EDIT ========================

I have been testing different approaches all day to try and resolve this.

I have returned to ionic version 1.1.1 and CLI 1.7.0
because I created a new app using “blank” starter into which I pasted the demo HTML from ionic ion-slide-box js docs.
This worked proving that it as a minimalist code base / app all is fine (providing I add some CSS height to the box class, see demo html to know where box class is declared)

I noted that in the starter app file structure there was NO ng-cordova folder.
However in my app that i have been testing on devices I have one.
(My archive backup suggests it has only been the case since August 2015, before then I didn’t have one either.)

The app now doesn’t like running without this folder.
I tried copying all my app / services / controller js & css & html / html templates and pasting into the starter template.

I tweaked the index html to ensure the ng-controller & ng-app were correct but still blank white screen with no output not even a single character in firebug error console.

Do I need this folder ?

If not how do I successfully purge it and all refs to it from my app file structure ?
What command can I run to refresh all the ionic files to ensure that the app will run and is not expecting any resources contained in this directory ??


I ensured that the HTML matches the code example in the 1.1.1. docs.
This meant that I could remove the height in my example above and I was left with the same result,
all slides piled one on top of other like a deck of playing cards.

What do I need to do to ensure that the app can correctly position them next to each other neatly in a row i.e. display:inline

I must confess that now I’m even more confused !

end result is slidebox still not working in my app.