0.1.1 • Published 4 years ago

@rzdesign/ngx-category-selector v0.1.1

Weekly downloads
-
License
MIT
Repository
github
Last release
4 years ago

NgxCategorySelector npm version

Angular category selector component & form control.

This library was generated with Angular CLI version 10.1.5.

NgxCategorySelector Demo

Installation

npm i @rzdesign/ngx-category-selector

How to use it

Import NgxCategorySelectorModule in your module.

import {NgxCategorySelectorModule} from '@rzdesign/ngx-category-selector';
Selector: lib-ngx-category-selector
<lib-ngx-category-selector [data]="categoryData"
                           (selection)="onCategorySelect($event)"></lib-ngx-category-selector>

Data source example:

  categoryData: CategoryNode[] = [
    {
      id: 1, name: 'Fruits', children: [
        {
          id: 3, name: 'Tropical', children: [
            {
              id: 9, name: 'Subtropical', children: []
            }
          ]
        },
        {id: 4, name: 'Melons', children: []},
        {id: 5, name: 'Berries', children: []},
        {id: 6, name: 'Citrus', children: []}
      ]
    },
    {
      id: 2, name: 'Vegetables', children: [
        {id: 7, name: 'Leaves', children: []},
        {id: 8, name: 'Root', children: []},
      ]
    },
  ];

@Inputs()

InputTypeRequiredDescription
dataCategoryNode YESArray of CategoryNodes
selectCategoryNodeoptionalPreselects a category

@Outputs()

OutputTypeRequiredDescription
selectionCategoryNodeYESEmits the selected category node

Planned features

  • add unit tests
  • implement ControlValueAccessor's setDisabledState => add ability to disable the control, add styling according to form state
  • implement ControlValueAccessor => add ability to use the component as a form control

Examples

Check examples by running the app.

  1. clone repo git clone https://github.com/zr87/ngx-category-selector
  2. cd to repo folder and install dependencies npm install
  3. start application: ng serve

    Examples are under src/app/app.component.ts

:mailbox_with_mail: License & Postcardware

The package is completely free (MIT license) to use, however the package is licensed as Postcardware. This means that if it makes it to your production environment, we would very much appreciate receiving a postcard from your hometown.

RZdesign, Becsi way 225 8/45, 1032 Budapest, Hungary

0.1.1

4 years ago

0.1.0

4 years ago

0.0.2

4 years ago

0.0.1

4 years ago

1.0.0

4 years ago