Configure ng-show and ng-hide speed

Question

Please can I modify the speed of Angular's ng-show and ng-hide? jQuery has parameters to modify the speed of show() and hide(), so I'm just wondering if that can be done with Angular.

Thanks

Answer 1

Sure can, Have a look at the ng-animate stuff that Angular provides. Here's an example from their docs that you can tweak. The speed is defined in the CSS file:

transition: all linear 0.5s;

Answer 2

You could bind them to model properties which change on a timer.

So have a property in your controller which show/hide is bound to:

$scope.myObject = {
    showElement: false;
};

Then in your view:

<div ng-show="myObject.showElement">Boom!</div>

And then your timer (using Angular):

$timeout(function () {
    $scope.myObject.showElement = true;
}, 100);