angularjs - このアニメーションをトリガーするこのディレクティブを実装する正しい AngularJS 1.2 の方法は何ですか?

Question

次のようにトゥイーンするディレクティブを作成しました: app.directive('fadeInDown', function ($animate) {

    var directive = {
        link: link,
        restrict: 'A',
    };
    return directive;

    function link(scope, element, attrs) {
        scope.$watch(attrs.delay, function (newVal) {
            TweenMax.set(element, { position: 'relative' });
            TweenMax.from(element, attrs.speed, { opacity: 0, top: '-20px', delay: attrs.delay, onComplete: done });

            function done() {
                var test = "DONE";
            }
        });
    };
});

そして、私はそれを次のように呼び出します。

<div id="home-view" class="body-wrapper" data-ng-controller="home as vm">
 <div class="container">
    <div class="row">
        <div class="col-md-12 col-sm-12" data-fade-in-down data-delay=".2" data-speed="1">
            <div class="callout-box clearfix">
                <div class="callout-content">
                    <h2 class="h1-section-title">BLAH BLAH BLAH.</h2>
                </div>
            </div>
        </div>
    </div>
</div>

アニメーションは完全に機能しますが、angular 1.2.13 で $animate を使用してこれを行う方法を知りたいですか?

私は次のことを試しました：

app.directive('fadeInDown', function ($animate) {
    var directive = {
        link: link,
        restrict: 'A'
    };
    return directive;

    function link(scope, element, attrs) {
        scope.$watch(attrs.hideMe, function () {
            $animate.addClass(element, "fade-in");
        });
    }
});

しかし、どのようにパラメーターをアニメーションに戻すのですか????

クラスは、次のように別のモジュールにロードされます。

(function () {
'use strict';

var app = angular.module('app');


app.animation('.fade-in', function () {
    return {
        addClass: function(element, done) {
            TweenMax.set(element, { position: 'relative' });
            TweenMax.from(element, attrs.speed, { opacity: 0, top: '-20px', delay: attrs.delay, onComplete: done });
        }
    };
});
})();

誰もこれを正しくする方法を説明できますか???

質問が明確でない場合はお知らせください。

ありがとう！！！