Angular uib typeahead, typeahead-is-open not working

Question

I have a angular uib-typeahead. Here is a link to plunkr that I created.https://plnkr.co/edit/8XwhSXsZlyd0oKSljS9t?p=preview.

I have used typeahead-is-open property.

What I want is when I click on the uib-typeahead it should open and display all the values. I am assuming setting the typeahead-is-open to true does this job. Is this correct? Currently the typeahead does not open up on setting typeahead-is-open to true.

Here is my html

<input ng-click = "myFunc()" click-outside="typeaheadIsOpen = false;" type="text" ng-model="selected" uib-typeahead="state for state in states | filter:$viewValue | limitTo:8" typeahead-is-open="typeaheadIsOpen" class="form-control">

My JS

$scope.myFunc = function() {
   $timeout(function() {
       $scope.typeaheadIsOpen = true;
       $scope.$digest();
   })
}

I have bound the typeahead-is-open to "typeaheadIsOpen" variable. On clicking on the typeahead I invoke myFuc() which sets the variable typeaheadIsOpen to true.

But the typeahead does not open. Is there something I am doing wrong?

Answer 1

It seems that you can't control whether the typeahead popup is shown or not using typeahead-is-open attribute. Here is the relevant part from source code:

UibTypeaheadController

//binding to a variable that indicates if dropdown is open
var isOpenSetter = $parse(attrs.typeaheadIsOpen).assign || angular.noop;
...
scope.assignIsOpen = function (isOpen) {
    isOpenSetter(originalScope, isOpen);
};

This attribute is used to obtain expression used to update the scope when typeahead is open, but is not used to get value from scope and no relevant watcher is setup.