ng2-listbox-dual
An Angular 6 component inspired by the following jQuery library: https://github.com/Geodan/DualListBox
Uses Bootstrap 3 classes for styling and responsiveness
Documentation
Option | Type | Default | Description |
---|---|---|---|
data |
Array<{}> | [] | List of available objects. |
selected |
Array<{}> | [] | List of selected objects. |
valueField |
String | id | Field of the object to get value. |
textField |
Array | ["name"] | Field(s) of the object to show. |
separator |
String | " - " | The separator beetween fields (textField) to show. |
Demo
http://ng2-duallistbox-demo.surge.sh/
Installation
To install this library, run:
$ npm install ng2-listbox-dual --save
and then from your Angular AppModule
:
;; ; // Import your library;
Use it in your template like this. Check the documentation for other available fields, but these are mandatory
You can also use ngModel and formControlName. When this is used the variable or form control used will have the value of the selected list box.
Development
To generate all *.js
, *.d.ts
and *.metadata.json
files:
$ npm run build
To lint all *.ts
files:
$ npm run lint
License
MIT © Cristina Guerra