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.

• npm i sls-multiselect-checkbox

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

onChange
onSelectAll

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

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>