Set animation with state.go

[jake142]

I need to set the animation from the controller when a button is clicked (I need to have more then 1 leave animation). I tried $state.current.data = {new animation} and it seems to work. Is there a better way to have multiple animations that are set in the controller.

[homerjam]

There isn't an easy way to do this at present - the way you have identified is a good workaround.

In a site which required varying transitions I used additional properties in the state.data object in combination with $stateParams to achieve this, like so:

        enter: {
            'in': /*@ngInject*/ function($state, $stateParams) {
                if ($state.current.name === $state.previous.name && $stateParams.dir) {
                    if ($stateParams.dir === 'next') {
                        return {
                            transition: 'slideLeft',
                            priority: 3
                        };
                    } else {
                        return {
                            transition: 'slideRight',
                            priority: 3
                        };
                    }
                }

                return {
                    transition: $state.previous.data && $state.previous.data.level > $state.current.data.level ? 'zoomOutDelayed' : 'zoomInDelayed',
                    priority: 3
                };
            },

[jake142]

thanks