sls-multiselect-checkbox v0.1.3

Multiselect Checkbox - Angular Library

This library gives you a list of checkboxes when you provide any list of data. You can select items from checkboxes and the library provides events of the selection change event and selects all event.

Installation

• npm i sls-multiselect-checkbox

Configurations

Atributes

title : string
selectedBoxTitle : string
dataList : any
showSelectedData : boolean
textField : string 

Events

onChange
onSelectAll

Usage

<sls-multiselect-checkbox [title]="'Title-Data'" [dataList]="data"  [showSelectedData]="true" [selectedDataList]="selectedData"
  [textField]="'value'" (onChange)="onDataSelectionChange($event)" (onSelectAll)="onSelectAll($event)">
</sls-multiselect-checkbox>

Examples

1) When data in list are not object.

    No need to include "textField" attribute.

    let dataExample=['Example1','Example2','Example3'];
    let selectedData=['Example2'];
	
    <sls-multiselect-checkbox [title]="'Title-Data'" [dataList]="dataExample" [showSelectedData]="true"
      (onChange)="onDataSelectionChange($event)" (onSelectAll)="onSelectAll($event)" [selectedDataList]="selectedData">
    </sls-multiselect-checkbox>

1) When data in list are object.

    Need to be include "textField" attribute with field name which you want to show as text of checkbox.

    let dataExample=[
        {key:'Key1',value:'Value1'},
        {key:'Key2',value:'Value2'},
        {key:'Key3',value:'Value3'},
      ];
	  
	let selectedData=[];
    
    <sls-multiselect-checkbox [title]="'Title-Data'" [dataList]="dataExample" [showSelectedData]="true"
       [textField]="'value'" (onChange)="onDataSelectionChange($event)" (onSelectAll)="onSelectAll($event)" [selectedDataList]="selectedData">
    </sls-multiselect-checkbox>