2

私のangular-jsアプリケーションでは、各ユーザーがそれをどのように使用しているかを追跡したいと思います。したがって、最初は、ユーザーがクリックしたものを追跡し、データをサーバーに送信するために、クライアント上にログメカニズムを構築しています。

ここでの主な質問は、アプリケーション全体のすべてのng-clickイベントをログに記録したいということです。これを一元化して、各機能に移動して機能を追加する必要がないようにすることは可能ですか？

最終的には、クリックされたdivのIDをログメッセージに含めたいと思います。

4

2 に答える 2

2

次のように、ディレクティブとサービスを使用します。

app.directive('logClickEvent', function(Logger) {
  return {
    restrict: 'A',
    link: function (scope, element, attrs) { 
      element.bind('click', function(event) {
        Logger.logEvent(event);
      });
    }
  }  
})

app.factory('Logger', function () {
  return { 
    logEvent: function(event) {
      // implement your logger logic here
    }
  };
});

次に、ログに記録するすべての要素にディレクティブを配置します。

<button id="button1" log-click-event>button1</button>

jsFiddle : http://jsfiddle.net/bmleite/7wBsv/

オプション #2 :「オーバーライド」ng-click: http://jsfiddle.net/bmleite/7wBsv/2/

于 2013-01-18T09:40:06.430 に答える
0

クリック イベント ハンドラーを html body/document オブジェクトに追加して、そのように処理するのはどうですか?

bmleite の jsFiddle の拡張 - http://jsfiddle.net/w8txe/3/

ただし、重要なことは、ID をログに記録するだけで十分な情報が得られるかどうか、そうでない場合、ログを有効にするためにどのように関連情報を引き出すかということです。

$location / $rootScope / などをいつでも渡して、ログ ハンドラーでより多くのコンテキスト情報を引き出すことができます。

<body log-click-event>
    <div ng-controller="Ctrl">
      <button id="button1">button1</button>
      <button id="button2">button2</button>
     <div id="div1" class="box">
          <ul>
              <li id="li1">Some LI</li>
              <li id="li2">Some LI</li>
              <li id="li3">Some LI</li>
         </ul>
     </div>
<div>

于 2013-01-22T13:19:01.383 に答える