問題タブ [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.
angularjs - ngShow の ngAnimate。初回起動時のアニメーションを防止する
最近追加された angular.js アニメーション機能をいじっていましたが、期待どおりに動作しません
上の myDiv を台無しにし、dom.ready
フェードアウトを開始します。最初は非表示にする必要があります。それを修正する方法は?
angularjs - Angularjs ng-animate + スライド効果の CSS トランジション
ng-animate
Angularの新機能でスライド効果を実現しようとしています。デモ サイトからいくつかのコードを取得し、フィドルを用意しました。
問題は、アイテムが配列からスワップされているときに、スライドの下の要素が上下DIV
にシフトし続けることです。私は試してみましline-height
たが、成功しませんでした。
上記の動作を修正することは可能ですか? または角度とCSSだけでそれを達成するためのより良い方法はありますか?
javascript - javascriptを使用したAngular ng-animateが期待どおりに機能しない
JS を使用してデモの例を実装しようとしましたが、ng-switch で問題が発生しました...新しい要素が dom に追加されていることがわかりますが、ng-switch は不要な DIV を削除していません。助けてくれませんか...
これがフィドルです...
javascript - ng-view と ng-animate はディレクティブを 2 回実行します
angularjs 1.1.4 の ng-view と ng-animate で遊んでいるときに、ディレクティブが 2 回実行されることに気付きました。画面に入るビュー内の要素に対して 1 回、画面から出るビュー内の要素に対して 1 回 (ビューが画面に入ったときに、その要素に対してディレクティブが既に実行されている間)。
私の理解では、ディレクティブは画面に入る要素に対してのみ実行され、画面から出る要素に対しては実行されるべきではありません。または私は何かを逃していますか?
私はこれのためにjsfiddleをセットアップしましたhttp://jsfiddle.net/mediastuttgart/f4FPj/1/
ご覧のとおり、アプリの初期化時にカウンターは 1 を示します。ただし、ナビゲートを開始すると、カウンターは 2 ずつ増加します。
乾杯マイケル
編集
もちろん、回避策として要素にクラスを追加し、ディレクティブでそれをチェックすることもできますが、それは実現すべき方法ではないと思います。
angularjs - Angular ng-animate 変更属性
ng-views(partials) を保持する div があります
コントローラーの myAnimation を次から変更します
に
また、{{myAnimation}} をビューに出力して、変更を確認できるようにします。
問題は、変更が行われたにもかかわらず、4 番目のアニメーションがまだトリガーされていることです。アニメーションは更新されません。アニメーションのトリガーの開始とセットアップを監視するためのディレクティブを設定したので、それが機能することはわかっています。同じ問題が発生します。動作しますが、変わりません。
これについての助けに本当に感謝します。私はこのテクニックを YearOfMoo サイトhttp://www.yearofmoo.com/2013/04/animation-in-angularjs.htmlで取り上げました 。
「$scope を変更して特定のアニメーションをスキップする」
css - CSS のスコープを狭くしながら、AngularJS テンプレートを動的に追加および削除する
だから私はいくつかの異なるテンプレートを持っていng-view
ますng-animate
. 各テンプレートには独自の CSS があり、CSS の衝突を防ぐ方法を見つけて、template1 の h1 宣言が template1 にのみ適用され、template2 には適用されないようにする必要があります。
私が現在認識しているオプションは、テンプレートに一致する ID として定義できる親要素を対象とするページに提供される CSS を書き直すことです。もう 1 つのあまり望ましくないオプションは、iframe を使用することです。これは、アプリの複数のインスタンスをそれぞれ独自の iframe で同時に実行することを意味します。
そこに他のオプションはありますか?各 CSS 宣言を分離するという目標を解決するには、どの方法が最適ですか?