From 0dce1cda37b5c863e5c5e8f31ac3344f4d4271b4 Mon Sep 17 00:00:00 2001 From: Jakub Freisler Date: Sun, 27 May 2018 23:22:52 +0200 Subject: [PATCH 1/3] docs(ngAnimate): refactor of ngAnimate docs `Which directives support animations?` section: Added info about ngAnimateSwap directive. Sorted table alphabetically, now it's the same order as appear in documentation's navigation. References #16561 --- docs/content/guide/animations.ngdoc | 17 +++++++++-------- 1 file changed, 9 insertions(+), 8 deletions(-) diff --git a/docs/content/guide/animations.ngdoc b/docs/content/guide/animations.ngdoc index 22e4df094839..3b3efefdafbd 100644 --- a/docs/content/guide/animations.ngdoc +++ b/docs/content/guide/animations.ngdoc @@ -222,20 +222,21 @@ triggered: | Directive | Supported Animations | |-------------------------------------------------------------------------------|---------------------------------------------------------------------------| -| {@link ng.directive:ngRepeat#animations ngRepeat} | enter, leave, and move | -| {@link ng.directive:ngIf#animations ngIf} | enter and leave | -| {@link ng.directive:ngSwitch#animations ngSwitch} | enter and leave | -| {@link ng.directive:ngInclude#animations ngInclude} | enter and leave | -| {@link ngRoute.directive:ngView#animations ngView} | enter and leave | -| {@link module:ngMessages#animations ngMessage / ngMessageExp} | enter and leave | +| {@link ng.directive:form#animations form / ngForm} | add and remove ({@link ng.directive:form#css-classes various classes}) | | {@link ng.directive:ngClass#animations ngClass / {{class}​}} | add and remove | | {@link ng.directive:ngClassEven#animations ngClassEven} | add and remove | | {@link ng.directive:ngClassOdd#animations ngClassOdd} | add and remove | | {@link ng.directive:ngHide#animations ngHide} | add and remove (the `ng-hide` class) | -| {@link ng.directive:ngShow#animations ngShow} | add and remove (the `ng-hide` class) | +| {@link ng.directive:ngIf#animations ngIf} | enter and leave | +| {@link ng.directive:ngInclude#animations ngInclude} | enter and leave | | {@link ng.directive:ngModel#animations ngModel} | add and remove ({@link ng.directive:ngModel#css-classes various classes}) | -| {@link ng.directive:form#animations form / ngForm} | add and remove ({@link ng.directive:form#css-classes various classes}) | +| {@link ng.directive:ngRepeat#animations ngRepeat} | enter, leave, and move | +| {@link ng.directive:ngShow#animations ngShow} | add and remove (the `ng-hide` class) | +| {@link ng.directive:ngSwitch#animations ngSwitch} | enter and leave | +| {@link ngAnimate.directive:ngAnimateSwap#animations ngAnimateSwap} | enter and leave | +| {@link module:ngMessages#animations ngMessage / ngMessageExp} | enter and leave | | {@link module:ngMessages#animations ngMessages} | add and remove (the `ng-active`/`ng-inactive` classes) | +| {@link ngRoute.directive:ngView#animations ngView} | enter and leave | For a full breakdown of the steps involved during each animation event, refer to the {@link ng.$animate API docs}. From c8cd60d9a815fee2f48317be1861d0327f2e76bf Mon Sep 17 00:00:00 2001 From: Jakub Freisler Date: Sun, 27 May 2018 23:27:37 +0200 Subject: [PATCH 2/3] docs(ngAnimate): refactor of animation aware directives table Synced this table with one which appears in animations guide (docs/content/guide/animations.ngdoc). References #16561 --- src/ngAnimate/module.js | 29 +++++++++++++++++------------ 1 file changed, 17 insertions(+), 12 deletions(-) diff --git a/src/ngAnimate/module.js b/src/ngAnimate/module.js index f37c404f7d7f..8e35e439fb25 100644 --- a/src/ngAnimate/module.js +++ b/src/ngAnimate/module.js @@ -17,18 +17,23 @@ * ## Directive Support * The following directives are "animation aware": * - * | Directive | Supported Animations | - * |----------------------------------------------------------------------------------------------------------|--------------------------------------------------------------------------| - * | {@link ng.directive:ngRepeat#animations ngRepeat} | enter, leave and move | - * | {@link ngRoute.directive:ngView#animations ngView} | enter and leave | - * | {@link ng.directive:ngInclude#animations ngInclude} | enter and leave | - * | {@link ng.directive:ngSwitch#animations ngSwitch} | enter and leave | - * | {@link ng.directive:ngIf#animations ngIf} | enter and leave | - * | {@link ng.directive:ngClass#animations ngClass} | add and remove (the CSS class(es) present) | - * | {@link ng.directive:ngShow#animations ngShow} & {@link ng.directive:ngHide#animations ngHide} | add and remove (the ng-hide class value) | - * | {@link ng.directive:form#animations form} & {@link ng.directive:ngModel#animations ngModel} | add and remove (dirty, pristine, valid, invalid & all other validations) | - * | {@link module:ngMessages#animations ngMessages} | add and remove (ng-active & ng-inactive) | - * | {@link module:ngMessages#animations ngMessage} | enter and leave | + * | Directive | Supported Animations | + * |-------------------------------------------------------------------------------|---------------------------------------------------------------------------| + * | {@link ng.directive:form#animations form / ngForm} | add and remove ({@link ng.directive:form#css-classes various classes}) | + * | {@link ng.directive:ngClass#animations ngClass / {{class}​}} | add and remove | + * | {@link ng.directive:ngClassEven#animations ngClassEven} | add and remove | + * | {@link ng.directive:ngClassOdd#animations ngClassOdd} | add and remove | + * | {@link ng.directive:ngHide#animations ngHide} | add and remove (the `ng-hide` class) | + * | {@link ng.directive:ngIf#animations ngIf} | enter and leave | + * | {@link ng.directive:ngInclude#animations ngInclude} | enter and leave | + * | {@link ng.directive:ngModel#animations ngModel} | add and remove ({@link ng.directive:ngModel#css-classes various classes}) | + * | {@link ng.directive:ngRepeat#animations ngRepeat} | enter, leave, and move | + * | {@link ng.directive:ngShow#animations ngShow} | add and remove (the `ng-hide` class) | + * | {@link ng.directive:ngSwitch#animations ngSwitch} | enter and leave | + * | {@link ngAnimate.directive:ngAnimateSwap#animations ngAnimateSwap} | enter and leave | + * | {@link module:ngMessages#animations ngMessage / ngMessageExp} | enter and leave | + * | {@link module:ngMessages#animations ngMessages} | add and remove (the `ng-active`/`ng-inactive` classes) | + * | {@link ngRoute.directive:ngView#animations ngView} | enter and leave | * * (More information can be found by visiting each the documentation associated with each directive.) * From b652568e9d2ffbdf52c853a3d68846a13d94daf3 Mon Sep 17 00:00:00 2001 From: Jakub Freisler Date: Fri, 1 Jun 2018 04:46:13 +0200 Subject: [PATCH 3/3] docs(ngAnimate): reorder animated directives tables Reorder directives tables due to pull request's review (#16581) Unify under-the-table informations. Refers #16561 Refers #16581 --- docs/content/guide/animations.ngdoc | 10 ++++++---- src/ngAnimate/module.js | 11 +++++++---- 2 files changed, 13 insertions(+), 8 deletions(-) diff --git a/docs/content/guide/animations.ngdoc b/docs/content/guide/animations.ngdoc index 3b3efefdafbd..5807db4cd42e 100644 --- a/docs/content/guide/animations.ngdoc +++ b/docs/content/guide/animations.ngdoc @@ -223,23 +223,25 @@ triggered: | Directive | Supported Animations | |-------------------------------------------------------------------------------|---------------------------------------------------------------------------| | {@link ng.directive:form#animations form / ngForm} | add and remove ({@link ng.directive:form#css-classes various classes}) | +| {@link ngAnimate.directive:ngAnimateSwap#animations ngAnimateSwap} | enter and leave | | {@link ng.directive:ngClass#animations ngClass / {{class}​}} | add and remove | | {@link ng.directive:ngClassEven#animations ngClassEven} | add and remove | | {@link ng.directive:ngClassOdd#animations ngClassOdd} | add and remove | | {@link ng.directive:ngHide#animations ngHide} | add and remove (the `ng-hide` class) | | {@link ng.directive:ngIf#animations ngIf} | enter and leave | | {@link ng.directive:ngInclude#animations ngInclude} | enter and leave | +| {@link module:ngMessages#animations ngMessage / ngMessageExp} | enter and leave | +| {@link module:ngMessages#animations ngMessages} | add and remove (the `ng-active`/`ng-inactive` classes) | | {@link ng.directive:ngModel#animations ngModel} | add and remove ({@link ng.directive:ngModel#css-classes various classes}) | | {@link ng.directive:ngRepeat#animations ngRepeat} | enter, leave, and move | | {@link ng.directive:ngShow#animations ngShow} | add and remove (the `ng-hide` class) | | {@link ng.directive:ngSwitch#animations ngSwitch} | enter and leave | -| {@link ngAnimate.directive:ngAnimateSwap#animations ngAnimateSwap} | enter and leave | -| {@link module:ngMessages#animations ngMessage / ngMessageExp} | enter and leave | -| {@link module:ngMessages#animations ngMessages} | add and remove (the `ng-active`/`ng-inactive` classes) | | {@link ngRoute.directive:ngView#animations ngView} | enter and leave | +(More information can be found by visiting the documentation associated with each directive.) + For a full breakdown of the steps involved during each animation event, refer to the -{@link ng.$animate API docs}. +{@link ng.$animate `$animate` API docs}. ## How do I use animations in my own directives? diff --git a/src/ngAnimate/module.js b/src/ngAnimate/module.js index 8e35e439fb25..0f929f3b0018 100644 --- a/src/ngAnimate/module.js +++ b/src/ngAnimate/module.js @@ -20,22 +20,25 @@ * | Directive | Supported Animations | * |-------------------------------------------------------------------------------|---------------------------------------------------------------------------| * | {@link ng.directive:form#animations form / ngForm} | add and remove ({@link ng.directive:form#css-classes various classes}) | + * | {@link ngAnimate.directive:ngAnimateSwap#animations ngAnimateSwap} | enter and leave | * | {@link ng.directive:ngClass#animations ngClass / {{class}​}} | add and remove | * | {@link ng.directive:ngClassEven#animations ngClassEven} | add and remove | * | {@link ng.directive:ngClassOdd#animations ngClassOdd} | add and remove | * | {@link ng.directive:ngHide#animations ngHide} | add and remove (the `ng-hide` class) | * | {@link ng.directive:ngIf#animations ngIf} | enter and leave | * | {@link ng.directive:ngInclude#animations ngInclude} | enter and leave | + * | {@link module:ngMessages#animations ngMessage / ngMessageExp} | enter and leave | + * | {@link module:ngMessages#animations ngMessages} | add and remove (the `ng-active`/`ng-inactive` classes) | * | {@link ng.directive:ngModel#animations ngModel} | add and remove ({@link ng.directive:ngModel#css-classes various classes}) | * | {@link ng.directive:ngRepeat#animations ngRepeat} | enter, leave, and move | * | {@link ng.directive:ngShow#animations ngShow} | add and remove (the `ng-hide` class) | * | {@link ng.directive:ngSwitch#animations ngSwitch} | enter and leave | - * | {@link ngAnimate.directive:ngAnimateSwap#animations ngAnimateSwap} | enter and leave | - * | {@link module:ngMessages#animations ngMessage / ngMessageExp} | enter and leave | - * | {@link module:ngMessages#animations ngMessages} | add and remove (the `ng-active`/`ng-inactive` classes) | * | {@link ngRoute.directive:ngView#animations ngView} | enter and leave | * - * (More information can be found by visiting each the documentation associated with each directive.) + * (More information can be found by visiting the documentation associated with each directive.) + * + * For a full breakdown of the steps involved during each animation event, refer to the + * {@link ng.$animate `$animate` API docs}. * * ## CSS-based Animations *