Alex J Alex J - 3 months ago 10
AngularJS Question

AngularJS: How to conditionally apply view animations?

My question could be a little strength since I haven't found any other case like that.

I want to perform views animations, but not always. So far, I had the animation in the .css format:

.view.ng-enter{
animation: view_enter @anim-view-dur;
}

.view.ng-leave{
animation: view_leave @anim-view-dur;
}


So when I go from one page to another, it is performed.

The exactly case when I don't want the animation view to be applied is in a page where I have an ScrollSpy Bootstrap sidebar working. Since it's within a view, I had to do the anchor links with a function:

$scope.scrollTo= function (id){
$location.hash(id);
$anchorScroll();
};


And when this function is called, it's trigger the view animation. Is there any way to prevent from trigger the view animation in this case?

Thank you very much.

Answer

This was working for me:

// Routes config
app.config(function($routeProvider) {
    $routeProvider
    .when("/", {
        templateUrl : "main.htm"
        controller : "MyController"
        reloadOnSearch : true         
    })
});

You could also use this in router-ui