# multiple-checkboxes
> Multiple checkboxes module for Angular.
Latest version **0.0.6** (published 2018-07-13) · MIT license · 0 weekly downloads
## Install
```sh
npm install multiple-checkboxes
pnpm add multiple-checkboxes
yarn add multiple-checkboxes
bun add multiple-checkboxes
```
## Health
**Score 25/100 (F)** — status: abandoned.
Positive: has types; esm support; no vulnerabilities.
Warnings: low downloads; pre 1.0.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 0.0.6 |
| Published | 2018-07-13 |
| First published | 2018-07-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 13 |
| Unpacked size | 218.8 KB |
| Known vulnerabilities | 0 (+18 in 3 direct dependencies) |
| Install scripts | no |
| GitHub stars | 3 |
| Author | Rani More |
| Maintainers | ranimore |
| Keywords | angular, angular2, angular 2, angular4, angular 5, angular 6, checkboxes, multiple |
## Links
- npm: https://www.npmjs.com/package/multiple-checkboxes
- Repository: https://github.com/ranimore/multiple-checkboxes
- Homepage: https://github.com/ranimore/multiple-checkboxes#readme
- Issues: https://github.com/ranimore/multiple-checkboxes/issues
- npm.io page: https://npm.io/package/multiple-checkboxes
## Dependencies (13)
- [rxjs](https://npm.io/package/rxjs.md) ^6.0.0
- [tslib](https://npm.io/package/tslib.md) ^1.9.0
- [core-js](https://npm.io/package/core-js.md) ^2.5.4
- [zone.js](https://npm.io/package/zone.js.md) ^0.8.26
- [@angular/core](https://npm.io/package/@angular/core.md) ^6.0.2
- [@angular/http](https://npm.io/package/@angular/http.md) ^6.0.2
- [@angular/forms](https://npm.io/package/@angular/forms.md) ^6.0.2
- [@angular/common](https://npm.io/package/@angular/common.md) ^6.0.2
- [@angular/router](https://npm.io/package/@angular/router.md) ^6.0.2
- [@angular/compiler](https://npm.io/package/@angular/compiler.md) ^6.0.2
- [@angular/animations](https://npm.io/package/@angular/animations.md) ^6.0.2
- [@angular/platform-browser](https://npm.io/package/@angular/platform-browser.md) ^6.0.2
- [@angular/platform-browser-dynamic](https://npm.io/package/@angular/platform-browser-dynamic.md) ^6.0.2
## Recent versions
- 0.0.6 (latest) — 2018-07-13
- 0.0.5 — 2018-07-13
- 0.0.3 — 2018-07-12
- 0.0.2 — 2018-07-12
- 0.0.1 — 2018-07-12
## README
# multiple-checkboxes
Give the input array of object to show as checkboxes.This package returns checked items list and sorts list by checked items also provides filtering feature.
## screenshots
default with checked
filtering 
Background css
## Install package from npm
npm install multiple-checkboxes
## Include module in app.module.ts file
```TypeScript
import { MultipleCheckboxesModule } from 'multiple-checkboxes';
ngModule({
declarations: [AppComponent],
imports:[BrowserModule, MultipleCheckboxesModule],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
```
## Index.html
```HTML
```
## component.html
```HTML
```
1. **masterList** is input array
2. **title** is title to show
3. **DisplayField** is field you want to display as checkbox
4. **updatedlist** returns checked items as string from given list
5. **updatedListWithFulldata** returns checked items as json object from given list
6. **height** height of list div **_*optional_**
## In component.ts file
```TypeScript
locations=[{id:1,name:"Pune"},{id:2,name:"Mumbai"},{id:3,name:"Delhi"},{id:4,name:"Goa"}];
selectedLocationList(list){
console.log(list)
//if Pune and Goa is selected
//output will be ["Pune","Goa"] if updatedlist event used
//output will be [{id:1,name:"Pune"},{id:4,name:"Goa"}] if updatedListWithFulldata event used
}
```
## Custom css
```CSS
.bg-primary{
background-color: #2cb5b5 !important /*background color of title*/
}
.card-box{
height: 150px; /*div size of list //overflow scroll */
}
```
---
_Source: https://npm.io/package/multiple-checkboxes · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._