I have a set of collapsible lists and wonder if I am implementing in a good way. http://plnkr.co/edit/wnAQFuGtt7lh6p5TAjp4?p=preview
Aside from just wanting another set of eyes on it, my questions are:
Is my use of $broadcast(‘scroll.resize’) correct here?
I assume it’s ok to use ng-click on a div within ionic. On v0.96 it doesn’t usually fire the handler until a second tap, but this seems to have been fixed in the nightly. Testing on iOS7 Safari so far.
How should I get a “slideDown” transition when the list is expanded? Do I look at documentation for ngAnimate or is there a more ionic specific way?
It turns out that for the animation I need to know the item height, which is dynamic (and ‘auto’ doesn’t work for this supposedly). So I think I will use this plugin: http://angular-ui.github.io/bootstrap/
which has the “collapse” directive, so it’s a simple adjustment:
http://plnkr.co/edit/wnAQFuGtt7lh6p5TAjp4?p=preview (it works!)
The drawback is that it adds a dependency: bootstrap css (not the bootstrap js). And that is not fully compatible with Ionic – the conflict I found so far is that they both use the attribute “row” to mean different things. So bootstrap adds margin-left: -15px to “row” divs.
Downloading the stripped-down bootstrap css avoids the “row” conflict. It’s still 30k min though.
So I just grabbed the three css classes that are actually used for the collapse function. This removes the dependency on bootstrap css. I forked the plunkr to demonstrate this; added to the css file, and removed bootstrap.css.
Thanks @damienleri for the code reference.
Hello Ionic Team and all,
The collapsible list works well for me but I want to ask, is it a best practice to use Angular UI Bootstrap in Ionic i.e. Do Including external custom components like UI Bootstrap affect the Performance or native feel of an App?