<!DOCTYPE html>
<html ng-app="plunker">

<head>
  <script data-require="angular.js@1.4.3" data-semver="1.4.3" src="https://code.angularjs.org/1.4.3/angular.js"></script>
  <script data-require="angular-touch@" data-semver="1.4.3" src="https://code.angularjs.org/1.4.3/angular-touch.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.1/ui-bootstrap-tpls.min.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-controller="MainCtrl as ctrl">
  <a href="" ng-click="clicked = clicked +1">clicked :: {{clicked}}</a>
  <br>
  <br>
  <input 
  type="text"
  typeahead="state for state in states | filter:$viewValue | limitTo:8" 
  ng-model="query"
  typeahead-append-to-body="true"
   typeahead-focus-first="false"
  class="form-control">
</body>

</html>
var app = angular.module('plunker', ['ui.bootstrap','ngTouch']);

app.controller('MainCtrl', function($scope) {

 $scope.clicked = 0;
 
  $scope.states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California', 'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii', 'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana', 'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota', 'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire', 'New Jersey', 'New Mexico', 'New York', 'North Dakota', 'North Carolina', 'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island', 'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont', 'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'];
 
  
});
/* Styles go here */
body {
  height: 100%;
}