<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title></title>
<link rel="stylesheet" href="style.css">
<link href="http://code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet">
<script src="http://code.ionicframework.com/nightly/js/ionic.js"></script>
<script src="http://code.ionicframework.com/nightly/js/angular/angular.min.js"></script>
<script src="http://code.ionicframework.com/nightly/js/angular/angular-animate.min.js"></script>
<script src="http://code.ionicframework.com/nightly/js/angular/angular-sanitize.min.js"></script>
<script src="http://code.ionicframework.com/nightly/js/angular-ui/angular-ui-router.min.js"></script>
<script src="http://code.ionicframework.com/nightly/js/ionic-angular.js"></script>
<script src="script.js"></script>
</head>
<body>
<pane ng-controller="MyCtrl">
<header class="bar bar-header bar-positive">
<div class="buttons">
<button class="button button-icon icon ion-clock" ng-click="doScroll()"></button>
</div>
<h1 class="title">Click the Clock to Get Stuck</h1>
</header>
<content class="has-header">
<list>
<item ng-repeat="item in items"
item="item"
id="foo-{{item.id}}"
href="#/item/{{item.id}}">
Item {{ item.id }}
</list>
</content>
</pane>
</body>
</html>
angular.module('myApp',['ionic'])
.controller('MyCtrl', function($scope, $location, $ionicScrollDelegate) {
$scope.items = [];
for (var i=0; i < 1000; i++) {
$scope.items.push({id:i});
}
$scope.doScroll = function() {
$location.hash('foo-500');
$ionicScrollDelegate.anchorScroll();
}
});
/* Styles go here */