問題タブ [ng-animate]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - AngularJS 1.2のngAnimateの親と子
AngularJS 1.2 で、親アニメーションを使用すると、子アニメーションが機能しません。
をコメントアウトするapp.animation('.parent', function () { .. }
と、子アニメーションが正しく開始されます。
親アニメーションと子アニメーションを同時に動作させるにはどうすればよいですか?
HTML:
JS:
angularjs - ng-view ではなく ui-view で ng-animate を使用するにはどうすればよいですか?
angularJS v1.2 で angular-ui-router を使用しており、カスタム ページ遷移を実装したいと考えています。ng-view (標準的な方法) ではなくui-view ( angular-ui-router
から) で ng-animate を使用するにはどうすればよいですか? ng-view の参照については、AngularJS 1.2 のリマスターされたアニメーションを参照してください。
編集: コメントで提案されているように、v1.2.0-rc.2 と v1.2.0-rc.3 の 2 つの異なるバージョンの angular を試しましたが、どちらもうまくいかないようです。私は何か間違ったことをしているかもしれないと思いますか?
HTMLは次のとおりです。
そしてCSS:
前述の例のJSfiddleを追加しました。この例を拡張して ng-view と ui-view をカバーするのはいいことですが、ng/ui-view とパーシャルを JSfiddle に取り込む方法がわかりません。
angularjs - Angular.js // url/ng-view 変更前の ng-leave 状態
ngAnimationsに入ります。どうすればページ遷移を完全に制御できるのだろうと思っていました。
つまり、プロセスでURLを変更しながら、ng-enterに対して行われるのと同じ方法でng-leaveを制御できるということです。angular は初めてですが、ng-view の変更前に ng-leave コントロールを取得しようとしていると説明しました。
私が検索した限りでは、ng-leave 状態はng-switchでのみ意味を持ちます (別の ng がありますが、アイデアは得られました)。現時点では、すべての要素が既にページに存在している必要があり、プロセスに URL の変更は含まれていないことを意味します。
何か助けがあれば、大歓迎です。ng-animations は本当にクールだと思いますが、この点がかなり欠けていると思います。
おそらく従うべき別のパターンがあるかもしれないと仮定します。
angularjs - AngularJS で補間を含むディレクティブを再適用する方法
スライドイン用の簡単なアニメーション ディレクティブがあるとします。
そしてhtml:
よく働く。
ここで、html が Angular 補間を使用しているとしましょう:
これは、scope.foo の値の最初の変更では機能しますが、それ以降の試行では機能しません。
質問: 変更ごとにディレクティブを再適用する方法は?
これを時計とのリンク機能に入れるのが道のりのようです...
javascript - angular ng-animate により、モデルで奇妙なアニメーションが変更されました
私は現在Angular 1.2 rc3を使用しています.ng-repeatアイテムにトランジションを使用しました. ただし、ng-repeat のモデルを変更するたびに、移行がうまくいかないことがわかりました。項目のリスト全体がポップアップ表示されてから消えます。私が望んでいたのは、リスト全体を単純にフェードアウトし、新しいアイテムリストをフェードインすることです。どうすればその効果を達成できますか?
これを再現するプランカーは次のとおりです。http://plnkr.co/edit/lnsxCySFGmUmAnYDqVm3?p=preview 数行追加してからモデルを変更すると、奇妙な動作が見られます。
ありがとう。
javascript - スコープからアイテムを削除するときに AngularJS の ngAnimate を使用する
非常に簡単な質問:で、スコープからアイテムを削除するときに発砲することAngularJS 1.2.x
は可能ですか (また、どのように)ですか?ngAnimate
プランカーの例を次に示します。
http://plnkr.co/edit/tpl:FrTqqTNoY8BEfHs9bB0f?p=preview
コード:
脚本:
ご覧のとおり、「DELETE」ボタンをクリックすると で実行splice()
され$scope.imgs
ます。単に消えるのではなく、これをアニメーション化したいと思います。私はこの Year Of Moo の記事からコピー アンド ペーストしたトランジションを使用しています。
javascript - 動的ソースで ng-include にアニメーションを残す
動的 URL に基づいてコンテンツをロードする ng-include があります (期待どおりに動作します)。
問題は、コンテンツのenter
とをアニメーション化しようとしているときに発生leave
します (Angular ドキュメントによると、これらは ng-include がアニメーション化のために提供する 2 つのイベントです)。
はenter
期待どおりに機能していますが、leave
そうではありません。templateUrl
コントローラーで が変更されると、コンテンツがすぐに消えます (フェードアウトではありません) 。
何か案は?