Knockout Typeahead Binding
Simple knockout binding which wraps Twitter typeahead.js
Installation
npm install knockout.typeahead
Usage
Include in your bundle with browserify or webpack. You will need to have a loader configured for less files in order to get styling from the included stylesheet, or you can bring your own.
with a view model that looks like this:
{ thismyValue = ko; thisautocompleteMyValue = '/my/server/url?value=%QUERY';}
If the remote endpoint you are querying is returning a complex object instead of an array of suggestions, you can pass a remoteFilter
parameter to the binding, a function on your view model which returns the portion of the response object containing the array of suggestions.
If you are returning complex objects as suggestions, pass a templateName
into the binding to use a custom template.
Clone the repository then npm i && npm run start
to build the example.
Additional Binding Options
- function
mappingFunction
: Function on your model which will map the suggestion data returned from your queries (e.g. so you can use computed observables and extenders in your template) - string
displayKey
: Property name on complex object suggestion data which will be used to populate the hint/value of the typeahead input.