js STUDIO

ngClick

概要

タッチスクリーンデバイスで使用されるように、デフォルトのngClickをより強力に置き換えるように設計されたものです。 多くのモバイルブラウザは、タップ&リリース後、クリックイベントを送る直前に300ミリ秒程待機します。 この場合即座にそれを処理し、その後に続く伝搬からのクリックイベントを防ぎます。

ngTouchモジュールのインストールが必要になります。

このディレクティブは通常のクリックイベントを使用したフォールバックが可能で、 モバイルだけで無く、デスクトップブラウザでも動作します。

このディレクティブはまた、その要素が押されている間(マウスクリックまたはタッチによって)、 CSSクラスにng-click-activeを設定してくれるので、 押されてる要素のスタイル指定を可能にしてくれます。

使用方法 

<要素 ng-click="{expression}">
   ...
</要素>
引数 説明
ngClick

型：expression

タップ時に評価する式(expression)を指定します。 (イベントオブジェクトは、$eventとして利用可能です。)

デモ 

<!doctype html>
<html ng-app>
  <head>
    <script src="http://code.angularjs.org/1.2.1/angular.min.js"></script>
  </head>
  <body>
    <button ng-click="count = count + 1" ng-init="count=0">
      Increment
    </button>
    count: {{ count }}
  </body>
</html>

 Back to top

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

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

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