I have set up this jsBin to show the problem I am facing. When you visit the link and try to type "Five," the expected behavior would be to type "Five" and then press tab. However, in this case, you need to type "Five" and then either escape or click outside the box without selecting any other options.
Essentially, with typeahead functionality, pressing tab will select the first matching result for your input, which is not the desired behavior. I expect the selected option to exactly match what I am typing, requiring me to down-arrow to choose from the available results.
Below is the code snippet used in the jsBin:
<div ng-controller="TestController">
<div>
{{selected}}
</div>
<input type="text" ng-model="selected" typeahead="item for item in typeaheadOptions | filter:$viewValue">
</div>
And here is the corresponding JavaScript code:
var app = angular.module('app', ['ui.bootstrap'])
.controller('TestController', function($scope) {
$scope.typeaheadOptions = [
'One','Two','Three','Four','Five-Hundred','Fifteen','Fourteen','Fifty','Six','Seven','Eight','Nine','Ten'
]
});