unexpected behavior of typeahead

[Vishal1419]

I have an input using typeahead as follows:

<input type="text" id="unit" name="unit" class="form-control form-input" ng-model="item.unit"
            autocomplete="off" 
            typeahead-min-length="0" 
            uib-typeahead="unit as unit.symbol for unit in units | typeaheadFilter:{'symbol':$viewValue} | orderBy:smartOrder" 
            typeahead-template-url="unit-template.html" />
           

And here is the template:

<script type="text/ng-template" id="unit-template.html">
    <a tabindex="-1">
        <div class="row">
            <span class="col-md-6 col-sm-6" ng-bind-html="match.model.symbol | uibTypeaheadHighlight:query"></span>
            <span class="col-md-5 col-sm-5 col-md-offset-1 col-sm-offset-1" ng-bind-html="match.model.name  | uibTypeaheadHighlight:query"></span>
        </div>
    </a>
</script>

my units collection has two items:

1. name=kilogram symbol=kg
2. name=litre symbol=L

At first look I thought that typeahead works fine.

But when I tried the below key combinations, I found a bug.

Case: 1

Working:

When I type kg in typeahead and hit tab twice, the item.unit property has value:

Object {_id: "58cd0cdf28ea727c68be7ac3", name: "Kiogram", symbol: "kg", numberOfDecimalPlaces: 3, isSystemUnit: false…}

Not working:

But when I type kg in typeahead and hit escape and then hit tab, the item.unit property has value:

kg

Case:2

Working:

When I type kg in typeahead and hit tab twice the focus goes away from the control. Now item.unit property has value:

Object {_id: "58cd0cdf28ea727c68be7ac3", name: "Kiogram", symbol: "kg", numberOfDecimalPlaces: 3, isSystemUnit: false…}

And then if I delete the text in typeahead by using delete or backspace key, then if I move focus away from typeahead then item.unit is

undefined.

Not working:

When I type kg in typeahead and hit tab twice the focus goes away from the control. Now item.unit property has value:

Object {_id: "58cd0cdf28ea727c68be7ac3", name: "Kiogram", symbol: "kg", numberOfDecimalPlaces: 3, isSystemUnit: false…}

And then if I delete the text in typeahead by selecting the text and then using delete or backspace key, then I move focus away from typeahead, then item.unit is still having value:

Object {_id: "58cd0cdf28ea727c68be7ac3", name: "Kiogram", symbol: "kg", numberOfDecimalPlaces: 3, isSystemUnit: false…}

Plunker:

Here is the link to plunker that reproduces the issue: https://plnkr.co/edit/FIPANC3CcliNOeHHANxF