Some of the BS components need animations beyond simple CSS3 transitions (those are taken care of by BS classes). Components that need non-trivial animations are:
Filtering out the most rated answers from issues on Github |||||||||||_______|||| Also a sharing corner
Some of the BS components need animations beyond simple CSS3 transitions (those are taken care of by BS classes). Components that need non-trivial animations are:
@StanFaas please read the discussion & links provided.
An update will be posted if the status changes – consider silence to mean that this is still blocked.
any further idea of how you guys want to implement this? Was interested in getting animations for my modals and looking into how to do it here
Do we really need to reimplement all animations? I mean Bootstrap only adds simple classes and the animations are already part of the css/scss. We just have to adapt the same add/remove class behaviour like Bootstrap JS does.
It’s not about doing it in another or a better way, it’s just about doing it in a way that works with the Angular component lifecycle. Without declaring an animation on a component (using angular’s animations framework), destroying a component removes it from the DOM immediately.
ngOnDestroy()would not work as a place to remove a class and have it be animated.Using modals as an example, what we could do here – albeit by ignoring the angular animations framework and doing something “custom” – is have the
NgbModalservice call a method on the modal window component, which would remove the classes, then bind a listener to thetransitionendevent, at which point theNgbModalservice could actually destroy the component.@MickL just to be clear – I’m personally 100%% in support of doing this with CSS class manipulation if possible. In addition to requiring less code in the framework, it’s also far more customizable. It’s just not as straight forward to do in angular because of the component lifecycle issue. Unless I’m missing something.
How is the progress on this?
@pkozlowski-opensource It seems that ng-bootstrap alerts support fade-in / fade-out animations, but the documentation website is silent about it: https://ng-bootstrap.github.io/#/components/alert/examples
Could it be updated? It is impossible to find any info on the usage.
2.5 years later… its like the contributors have given up!
Any progress on this?
@ZiluckMichael if you check the pull request, it looks like it’s just waiting to be reviewed #2817
I have stopped using this library because of this issue and now I use ngx-bootstrap. I lost hope on this to ever get solved.
@tbickley-mediabowl Yes, but it has been waiting to be reviewed for over a year now. That is part of the problem.
Hey, a short update regarding animations, as things are more clear now.
We’ve tried a couple of solutions like using Angular animations and using a custom renderer for transitions in the past. Both didn’t work out for various reasons.
At the moment focus is to introduce simple internal tools for transition handling with
transitionendevent, customisable in the same way Bootstrap does it.That is the next big feature we’re hoping to release in ng-bootstrap.
The PR at works is #2817, it should move a lot in the coming days.