問題タブ [angularjs-animation]

TMをまだ「理解」していないか、命名法が逆になっているため、AngularJS アニメーションの設定にいつも苦労しています。きっと前者です。

たとえば、次の CSS は機能します。要素は、表示されると左から飛び込み、非表示になると左に戻ります。

しかし、私が得られないのは、ショーアニメーションを担当するセレクターが ng-hide-remove と呼ばれる理由です。誰かが命名法を明らかにすることができれば、将来的にアニメーションの設定がはるかに簡単になるでしょう.

私はAngularJsを初めて使用するので、次のことを行う必要がありました:

私はdivとボタンを持っています。ボタンをクリックしてajax呼び出しを行い、終了したらやりたいです:

1. divを削除します。
2. または、新しいものを追加します。

slideUpjQueryアニメーション（および）を使用して（もちろん同じクリックではなく）両方を行う方法を学びたいと思いますslideDown。

$animate apiへの参照、$animation は angular1.3 以降のコールバック プロミスをサポートしています。

しかし、私のコードは機能しませんでした

戻ってきた

私の angular と angular-animate はどちらも 1.3.0-beta.19
です 助けてください!

編集
自分で解決した問題。

コールバックの約束は v1.3.0-rc.0 以降でサポートされていますが、v1.3.0-beta.19 ではサポートされていないためです。

切り替え時に表の行を上下にスライドさせようとしていますng-show。私はAngularJS v1.3.0-rc.5を使用してngAnimationおり、アプリにモジュールを含めましたが、常にトグルし、アニメーションしません。私は何か間違ったことをしていますか？

HTML コードは次のとおりです。

トグル用の JavaScript は非常に基本的なもので、次のとおりです。

CSS アニメーション コードは次のとおりです。

AngularJS と ng-class を使用して、クラスが 3 つの可能な状態の間で変化するときにアニメーション化しようとしています。div のクラスで表される 3 つの状態になることができる div があります。状態は次のように定義されます。

1. <div class='myDiv'></div>
2. <div class='myDiv foo'></div>
3. <div class='myDiv bar'></div>

クラスfooとbarは排他的な意味で<div class="myDiv foo bar"></div>はないことに注意してください。次のように ng-class ディレクティブを使用しています。

<div class="myDiv" ng-class="{foo: first, bar: second}"></div>

コントローラーは、boolean 値 first と second の両方が同時に false になる可能性がありますが、true にはならないことを保証します。

ngAnimate は状態 1<-->2 と 1<-->3 の間の CSS 遷移を正しく検出しますが、2<-->3 からは検出しません。.myDiv.foo、.myDiv.bar、などのクラス セレクターに CSS トランジション コードを追加しようとしまし.myDiv.foo-add-activeたが、ngAnimate がそれらを検出しない (つまり、-add および -add-active クラスを追加しない) か、アニメーション クラスが追加されますが、遷移は発生しません。

これは、問題を示すjsFiddleへのリンクです。いずれかのボタンをクリックしてから再度クリックすると、作業中のトランジションが表示されます。どちらかのボタンをクリックしてからもう一方のボタンをクリックすると、トランジションがないことがわかります。

ngAnimate が適切に取得する魔法の遷移セットはありますか? それとも、これは ng-class を使用せずに独自のカスタム ディレクティブを記述する必要がある場合ですか?

/ の場所から離れたときに div を 200 ピクセル高く移動するアニメーションをトリガーするディレクティブがあります。/ の場所が開始点である限り、これはうまく機能しますが、別のルートから開始すると、addClass に到達しますが、実行されません。

アニメーションコード

ここで何が間違っていますか？