select li when down key is press in textarea

I have HTML like this

<div class="row">
    <textarea id="txtArea" ng-model="input"
              ng-change="handleOnChange(input);getSearchField(input);"
              ng-click="search(input)" ng-focus="search(input);"
              ng-keyup="search(input)" rows="10" cols="50" tabindex="0">
    </textarea>
    <div>
        <ul ng-if="shouldSelect">
            <li ng-repeat="f in func | filter:searchField"
                ng-click="typeSelected(f)"> {{f}} </li>
        </ul>
        <ul ng-if="shouldShowSubType">
            <li ng-repeat="f in selectedSubType"
                ng-click="subTypeSelected(f)"> {{f}} </li>
        </ul>
    </div>
</div>

Now What I am trying to do is that when I press down key, I should be able to select li from list and when I press enter, li text should be added in textarea model. How can I achieve that?

Source: AngularJS

Related Post