Typeahead is a AngularJS version of Bootstrap v2's typeahead plugin. This directive can be used to quickly create elegant typeaheads with any form text input.

It is very well integrated into AngularJS as it uses a subset of the select directive syntax, which is very flexible. Supported expressions are:

• label for value in sourceArray
• select as label for value in sourceArray

The sourceArray expression can use a special $viewValue variable that corresponds to the value entered inside the input.

This directive works with promises, meaning you can retrieve matches using the $http service with minimal effort.

The typeahead directives provide several attributes:

• ng-model : Assignable angular expression to data-bind to

• typeahead : Comprehension Angular expression (see select directive)

• typeahead-append-to-body (Defaults: false) : Should the typeahead popup be appended to $body instead of the parent element?

• typeahead-editable (Defaults: true) : Should it restrict model values to the ones selected from the popup only ?

• typeahead-input-formatter (Defaults: undefined) : Format the ng-model result after selection

• typeahead-loading (Defaults: angular.noop) : Binding to a variable that indicates if matches are being retrieved asynchronously

• typeahead-min-length (Defaults: 1) : Minimal no of characters that needs to be entered before typeahead kicks-in

• typeahead-on-select($item, $model, $label) (Defaults: null) : A callback executed when a match is selected

• typeahead-template-url : Set custom item template

• typeahead-wait-ms (Defaults: 0) : Minimal wait time after last character typed before typeahead kicks-in