ngn-multi-select

Multi Select Component Without Any Dependencies

Usage no npm install needed!

<script type="module">
  import ngnMultiSelect from 'https://cdn.skypack.dev/ngn-multi-select';
</script>

README

ngn-multi-select

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>