Skip to content
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src
.bowerrc
.gitignore
README.md
bower.json
gulpfile.js
package.json
tsconfig.json

README.md

Angular 2 Multiselect component

Installation

  • Clone repository
  • Install nodejs
  • Run npm install
  • Run gulp build task

Usage

<multiselect 
  (modelUpdated)="parentCompoentMethod($event)" 
  [multiple]="true" 
  [collection]="items" 
  [label]="'item_key'" 
  [mutiselectModel]="multiselectModel">
</multiselect>
import {Multiselect} from './multiselect';
...

@Component({
    selector: 'demo-component',
    ...
    directives: [Multiselect]
})

export default class DemoComponent {
    ...
    multiselectModel: Array<any> = [];
    parentCompoentMethod(multiselectModel: any) {
        this.multiselectModel1 = multiselectModel;
    }
}

API Documentation

Attribute Name Type Description
multiple true/false If value is true we can select many items, if false only one item
collection array A list of objects for multiselect
label string Key of a object which will be displayed for item
header string Header of multiselect (Default value 'Select')
mutiselectModel array/object Value of model from used component
modelUpdated function Function from used compoent which will update 'multiselectModel' value

Demo & How To

Go to http://igariok1990.github.io/angular2-multiselect/

Licence

The MIT License (MIT)

You can’t perform that action at this time.