$animate

説明

$animateサービスはクラスの追加・削除に加え、DOM内での要素の挿入、削除、移動といった基本的なDOM操作関数を提供します。 このサービスは、CSSとJavaScriptにフックする高水準のアニメーションを提供するngAnimateの$animatorサービスによって、 コアなサービスで使用されます。

$animateはAngularJSのコア部分で利用可能ですが、 ngAnimateモジュールは完全なアニメーションサポートを有効にする際に読み込むべきです。 ngAnimateモジュールを読み込まない場合は、$animateは単純なDOM操作オペレーションのみを実行します。

アニメーションのサポートを有効にする方法を更に詳しく知りたければ、 ngAnimateの$animateサービスのページはもちろんのこと、 ngAnimateモジュールのページも参照してください。

addClass(element, className, done)

提供されたelementに対し、提供されたclassNameのCSSクラス値を追加します。 この処理の完了後に、done()コールバックを実行します。(提供されていれば)

引数 説明
element

型:jQuery/jqLite要素

className値を追加する要素を指定します。

className

型:string

要素に追加されるCSSクラスを指定します。

done(optional)

型:function

elementにclassName値が追加された後に実行されるコールバック関数です。(提供されていれば)

enter(element, parent, after, done)

elementをafter要素の後ろ、またはparent要素内にDOM挿入します。 この処理の完了後に、done()コールバックを実行します。(提供されていれば)

引数 説明
element

型:jQuery/jqLite要素

DOM内に挿入される対象となる要素を指定します。

parent

型:jQuery/jqLite要素

子として追加するelementに対しての親要素を指定します。(もし、afterの要素が無ければ)

after

型:jQuery/jqLite要素

elementの兄弟要素を指定します。この要素の後ろにelementが追加されます。

done(optional)

型:function

elementにclassName値が追加された後に実行されるコールバック関数です。(提供されていれば)

leave(element, done)

DOMから要素を削除します。 完了すると、done()コールバックを実行します。(提供されていれば)

引数 説明
element

型:jQuery/jqLite要素

DOMから削除する要素を指定します。

done(optional)

型:function

DOMから要素が削除された後に呼び出されるコールバック関数を指定します。

move(element, parent, after, done)

DOM内の指定された要素の位置をafter要素の後ろ、またはparent要素内のどちらかに移動します。 完了すると、done()コールバック関数が実行されます。(提供されていれば)

引数 説明
element

型:jQuery/jqLite要素

DOM内での移動の対象となる要素を指定します。

parent

型:jQuery/jqLite要素

elementが挿入される親要素を指定します。(もし、after要素が無ければ)

after

型:jQuery/jqLite要素

兄弟要素を指定します。この要素の次の場所に、elementが配置されます。

done(optional)

型:function

elementが新しい位置に移動された後に実行されるコールバック関数です。(提供されていれば)

removeClass(element, className, done)

提供されたclassNameのCSSクラスの値を、提供されたelement(要素)から削除します。 完了すると、done()コールバック関数が実行されます。(提供されていれば)

引数 説明
element

型:jQuery/jqLite要素

className値を削除される対象となる要素を指定します。

className

型:string

要素(element)から削除するCSSクラスです。

done(optional)

型:function

className値が要素から削除された後に実行されるコールバック関数です。(提供されていれば)

 Back to top

© 2017 Google
Licensed under the Creative Commons Attribution License 3.0.

このページは、ページトップのリンク先のAngularJS公式ドキュメント内のページを翻訳した内容を基に構成されています。 下記の項目を確認し、必要に応じて公式のドキュメントをご確認ください。 もし、誤訳などの間違いを見つけましたら、 @tomofまで教えていただければ幸いです。

  • AngularJSの更新頻度が高いため、元のコンテンツと比べてドキュメントの情報が古くなっている可能性があります。
  • "訳注:"などの断わりを入れた上で、日本人向けの情報やより分かり易くするための追記を行っている事があります。