iMahmoudEmad / ngn-multi-select

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Multi select component without any dependencies or third party libraries

NgnMultiSelect Picture

NgnMultiSelect Picture

NgnMultiSelect Picture

Installation

install ngn-multi-select from npm

npm i ngn-multi-select --save

Usage

Add the package to NgModule imports:

import { NgnMultiSelectModule } from 'ngn-multi-select'

@NgModule({
  ...
  imports: [NgnMultiSelectModule]
  ...
})

Add component to your page:

<ngn-multi-select
    (data)="outputData = $event" //return the selected array of Ids
    [id]="'your id'" //has default id "multiSelect"
    [inputValue]="'input search value'" //has default value ""
    [inputValuePlaceholder]="'input placeholder value'" //has default "Search by item"
    [selectedItems]="[your, array, of, ids, here]" //has default value []
    [autocomplete]="'off'" //has default value "off"
    [isShown]="false" //has default value "false"
    [lists]="lists">
</ngn-multi-select>

About

License:MIT License


Languages

Language:TypeScript 59.0%Language:CSS 25.7%Language:JavaScript 15.3%