angular-dropdown-select

angular-dropdown-select

Multiple Dropdown Select - You can use this angular-dropdown-select apart from data tables as well.

Instance: A way to bind it with tables.

Installation

npm i angular-dropdown-select

Usage

Import

import { AngularDropdownSelectModule } from 'angular-dropdown-select';

Fundamental Usage

<lib-angular-dropdown-select [headings]="headings" [extras]="extras" (headingsCheckedUpdate)="selectedColumnChange($event)" (checkBoxCheckedUpdate)="getStatusOfUnselectedAll($event)"></lib-angular-dropdown-select>

Configuration - Props

  selectedColumnChange(event: any){
    console.log(event);
  }

  getStatusOfUnselectedAll(event: any){
    console.log(event);
  }

let headings: [
      { id: 1, name: 'id', checked: true },
      { id: 2, name: 'name', checked: true },
      { id: 3, name: 'age', checked: false },
      { id: 4, name: 'email', checked: true },
      { id: 5, name: 'emp_number', checked: true }
],

let extras:{
      uncheckAllStatus: false
}

Fundamentals / Mandatories

Property/Method	Type	Description
headings.id	number	IDs of dropdown select items
headings.name	string	Names of dropdown select items Or Headings of table shown in example
headings.checked	boolean	Status/Visibility of dropdown select
extras.uncheckAllStatus	boolean	Boolean flag to handle all checked/unchecked state

Future Plans

• More decorative Approach in terms of CSS.
• Will come up with search functionality.

Author

Suraj Motwani - Email: [e-mail]

License

Angular Dropdown Select is available under the MIT license. See the LICENSE file for more info.