example/index.html

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf8">
	<title>Google Analytics sample | Angulartics</title>
	<link rel="stylesheet" href="//bootswatch.com/cosmo/bootstrap.min.css">
	<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
	<script src="/node_modules/angulartics/dist/angulartics.min.js"></script>
	<script src="/dist/angulartics-ga.min.js"></script>
	<script>
	  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
	  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
	  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
		})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
  	ga('create', 'UA-10255892-9', { 'cookieDomain': 'none' });
	</script>

</head>
<body ng-app="sample">

<div class="navbar navbar-default">
	<div class="navbar-header">
		<a class="navbar-brand" href="#/">My App</a>
	</div>
	<div>
		<ul class="nav navbar-nav">
			<li><a href="#/a">Page A</a></li>
			<li><a href="#/b">Page B</a></li>
			<li><a href="#/c">Page C</a></li>
		</ul>
	</div>
</div>

<div class="container" ng-controller="ExampleCtrl as ctrl">
	<div ng-view></div>
	<hr>

	<button analytics-on="click" analytics-event="Button 1" analytics-category="Commands" class="btn btn-default">Button 1</button>

	<!-- same as analytics-on="click", because 'click' is the default -->
	<button analytics-on analytics-event="Button 2" analytics-category="Commands" class="btn btn-primary">Button 2</button>

	<!-- same as analytics-event="Button 3", because is inferred from innerText -->
	<button analytics-on analytics-category="Commands" class="btn btn-success">Button 3</button>

	<!-- note that analytics-category is never inferred, and is required by GA... if you leave it out, no event will be tracked -->
	<button analytics-on analytics-category="Commands"  analytics-label="Button4 label" analytics-value="1" class="btn btn-info">Button 4</button>

	<button ng-click="ctrl.userTimingsTest()" class="btn btn-default">UserTimings Test</button>
	<hr>

	<p class="alert alert-success">
		Open the network inspector in your browser, click any of the nav options or buttons above and you'll see the analytics
		request being executed. Then check <a class="alert-link" href="http://www.google.com/analytics/web/">your Google Analytics dashboard</a>.
	</p>
</div>

<script>
	angular.module('sample', ['angulartics', 'angulartics.google.analytics'])
	.config(function ($routeProvider) {
		$routeProvider
			.when('/',  { template: '<h1>Root Page</h1>'})
			.when('/a', { template: '<h1>Page "A"</h1>'})
			.when('/b', { template: '<h1>Page "B"</h1>'})
			.when('/c', { template: '<h1>Page "C"</h1>'})
			.otherwise({ redirectTo: '/' });
	})
	.controller('ExampleCtrl', function ($timeout, $analytics) {
		this.userTimingsTest = function() {
			var start = Date.now();
			$timeout(function() {
				var props = {
					timingCategory: 'Testing',
					timingVar: 'UserTimings',
					timingValue: Date.now() - start
				};
				$analytics.userTimings(props);
			}, 1000);
		};
	});
</script>
</body>
</html>