cannot navigate angular-ui boostrap typeahead with specific height with keyboard

Question

So, I think it's more a bootsrap issue than angular-ui, but I spent 2 nights over this and I cannot find the light at the end of the tunnel.

Here's the plunkr : http://plnkr.co/edit/n39LVjbHQzmcwGkk2dR1?p=preview

Search for "x" and then try to go down using the arrow keys. Items will be selected, but they will not gain focus.

Any ideas?

Answer 1

Here is a solution. I added another directive to the typeahead li element shouldFocus that watches for its active value to change. When it does it calls scrollIntoView on that element.

I guess this is considered a hack, but If typeahead allowed for dynamic templates, set from markup, then it would be a valid fix.

http://plnkr.co/edit/vzLHFqkHPUFCaaosVt5w?p=preview