search

rosslavery / angular2-tag-input

Tag input component for Angular 2
45 stars 42 forks source link

readme

angular2-tag-input

Tag input component for Angular 2

Demo & Examples

View Demo

Quick Start

npm install angular2-tag-input --save
// In one of your application NgModules
import {RlTagInputModule} from 'angular2-tag-input';

@NgModule({
  imports: [
    RlTagInputModule
  ]
})
export class YourModule {}

// In one of your component templates
<rl-tag-input [(ngModel)]="tags" placeholder="Testing placeholder"></rl-tag-input>

API

Inputs

Name Type Default Description
addOnBlur boolean true Whether to attempt to add a tag when the input loses focus.
addOnComma boolean true Whether to attempt to add a tag when the user presses comma.
addOnEnter boolean true Whether to attempt to add a tag when the user presses enter.
addOnPaste boolean true Whether to attempt to add a tags when the user pastes their clipboard contents.
addOnSpace boolean true Whether to attempt to add a tags when the user presses space.
allowDuplicates boolean false Allow duplicate tags.
allowedTagsPattern RegExp /.+/ RegExp that must match for a tag to be added.
autocomplete boolean false Toggle autocomplete mode on/off
autocompleteItems string[] [] List of suggestions for autocomplete menu
autocompleteMustMatch boolean true Whether a tag must be present in the suggestions list to be valid
autocompleteSelectFirstItem boolean true Pre-highlight the first item in the suggestions list
placeholder string 'Add a tag' Placeholder for the <input> tag.

Outputs

Name Type Emitted Description
addTag string Emits the added tag string
removeTag string Emits the removed tag string