This is my code. When I start typing, it filters the list.
I want to display all the values as drop down on focus of the input text.
If the user start typing, then I want filtering. If the user just focus and didn't type anything, I want to show all the values as drop down.
How can I do this ?
<script>
var app = angular.module('app', ['ui.bootstrap']);
app.controller('TypeaheadCtrl', function($scope, $http) {
$scope.selected = undefined;
$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'];
});
<h4>Search State</h4>
<pre>Model: {{selected | json}}</pre>
<input type="text" autocomplete="off" data-typeahead-editable="false" data-ng-model="selected" data-typeahead="state for state in states | filter:$viewValue | limitTo:8" class="form-control">
