<md-chips> is an input component for building lists of strings or objects. The list items are displayed as 'chips'. This component can make use of an <input> element or an <md-autocomplete> element.

Custom <md-chip-template> template A custom template may be provided to render the content of each chip. This is achieved by specifying an <md-chip-template> element as a child of <md-chips>. Note: Any attributes on <md-chip-template> will be dropped as only the innerHTML is used for the chip template. The variables $chip and $index are available in the scope of <md-chip-template>, representing the chip object and its index in the list of chips, respectively. To override the chip delete control, include an element (ideally a button) with the attribute md-chip-remove. A click listener to remove the chip will be added automatically. The element is also placed as a sibling to the chip content (on which there are also click listeners) to avoid a nested ng-click situation.

Pending Features

Style
• Colours for hover, press states (ripple?).
Validation
• allow a validation callback
• hilighting style for invalid chips
Item mutation
• Support <md-chip-edit> template, show/hide the edit element on tap/click? double tap/double click?
Truncation and Disambiguation (?)
• Truncate chip text where possible, but do not truncate entries such that two are indistinguishable.
Drag and Drop
• Drag and drop chips between related <md-chips> elements.

Warning: This component is a WORK IN PROGRESS. If you use it now, it will probably break on you in the future.