Is ng-animate included?

ionic-v1
1

A question: is ng-animate included on Ionic already or what can I use in order to set up animations with Ionic ?

2

It’s not included, you need to install it like this (or download from CDN/server wherever you like):

bower install angular-animate

Then make sure to load the files in your index.html:

<script src="lib/angular-animate/angular-animate.js"></script>

Finally include it in your angular module:

angular.module('app', ['ngAnimate']);
4 Likes
3

But i find this in ionic.bundle.js
/*!

  • ionic.bundle.js is a concatenation of:
  • ionic.js, angular.js, angular-animate.js,
  • angular-sanitize.js, angular-ui-router.js,
  • and ionic-angular.js
    */
2 Likes
4

Ok yeah just saw that, new to me as well. In that case just use the last line to inject the dependency and you should be good to go! I just don’t know which exact version of animate is bundled with ionic…

Anyway, let me know if that works for you!

1 Like
5

I had to add ng-animate.min.css :confused:

6

@saimon do you have any code snippets of you using nganimate in ionic?

Do you find it better than using CSS animations?

I’m constantly looking for ways to add animations into my apps but find a lot of them quite “janky” particularly on Android with an S5 running Lolipop which I don’t expect.

Thanks for any help offered :smile:

7

Right now I have no example for ngAnimate, I have tried the Move.js framework, maybe you want to take a look at Animations For Your Ionic App with Move.js

It’s a lightweight alternative to CSS animations, I found it quite interesting for some tiny animations!

But I will also try to take a closer look at ngAnimate and if it’s better than CSS animations…

8

Hello @xorox,

What do you mean ng-animate.min.css?? Where’s that file located? I didn’t know angular animate had such a file…

There is no mention of it here in the docs

Please let me know what do you mean sir.

9

Hi @jlstr

Thanks for your question.

I made a typo. It’s actually called nganimate.css. Apologize for the typo.

10

And thank You for the reply. I am still wondering about what CSS file are you referring to, I’ve never had to use (or seen) a CSS file that’s mandatory for the ng-animate module. Could you please point it out to me somehow?

11

I’m new to ionic and angular. Found this discussion useful.
I want to try out ng-animate.

Is following the css, referred by @xorox ?

Thank you

12

The ng-animate css is included in ionic.css.