0.5.0 • Published 6 years ago
ember-typeahead v0.5.0
Ember-typeahead
ember-typeahead
is an ember-cli addon that wraps up the typeahead.js and Tokenfield for Boostrap plugins and exposes them through a single ember component.
Usage
Typeahead
The default usage of the type-ahead
component gives the consumer a typeahead.js search:
{{type-ahead
id="typeahead-id"
content=contentArray
displayKey="name"
valueToken="name"
placeholder="Search by name"
class="form-control"
selectOnEnter=true
suggestionTemplate=suggestionTemplate
emptyTemplate=emptyTemplate
limit=numberofresultstodisplay
onSelectAction="ActionToRunOnSelect"}}
Tokenized
Switching the typeahead from a typeahead.js function to a Tokenfield for Bootstrap function is as simple as passing tokenized=true
into the component as well as setting the value
property to a comma-delimited string of values that will be bound as the tokenized list of items selected in the input.
{{type-ahead
id="typeahead-id"
tokenized=true
value=selectedApps
content=contentArray
displayKey="name"
valueToken="name"
placeholder="Search by name"
class="form-control"
suggestionTemplate=suggestionTemplate
emptyTemplate=emptyTemplate}}
Installation
git clone https://github.com/dhaulagiri/ember-typeahead
this repositorycd ember-typeahead
yarn
Running
ember serve
- Visit your app at http://localhost:4200.
Further Reading / Useful Links
- The typeahead.js component is based heavily on the ember-cli-twitter-typeahead addon
- Tokenfield for Boostrap
- typeahead.js
npm test
(Runsember try:each
to test your addon against multiple Ember versions)ember test
ember test --server
Building
ember build
For more information on using ember-cli, visit https://ember-cli.com/.