Creating removeClass animations with ngClass

AngularJS provides hooks that can be used to define a custom animation when a directive fires a removeClass event. The following directives will generate removeClass events:

• ngShow: This fires the removeClass event after the ngShow expression evaluates to a non-truthy value, and just before the contents are set to hidden

• ngHide: This fires the removeClass event after the ngHide expression evaluates to a truthy value, and just before the contents are set to hidden

• ngClass: This fires the removeClass event just before the class is removed from the element

• ngForm: This fires the removeClass event to remove validation classes

• ngModel: This fires the removeClass event to remove validation classes

• ngMessages: This fires the removeClass event to remove the ng-active class when there are no messages, or to remove the ng-inactive class when one or more messages are visible

Getting ready

Suppose that you want to have a div element slide out of the view when a class...