# ngx-select2

> Select2 component for Angular

Latest version **0.3.0** (published 2020-02-18) · Apache License 2.0 license · 0 weekly downloads

## Install

```sh
npm install ngx-select2
pnpm add ngx-select2
yarn add ngx-select2
bun add ngx-select2
```

## 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.3.0 |
| Published | 2020-02-18 |
| First published | 2017-06-29 |
| Weekly downloads | 0 |
| License | Apache License 2.0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 172.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Lon.L.Yang |
| Maintainers | dove2580 |
| Keywords | Select2, Angular |

## Links

- npm: https://www.npmjs.com/package/ngx-select2
- Repository: https://github.com/lon-yang/ngx-select2
- Homepage: https://github.com/lon-yang/ngx-select2#readme
- Issues: https://github.com/lon-yang/ngx-select2/issues
- npm.io page: https://npm.io/package/ngx-select2

## Recent versions

- 0.3.0 (latest) — 2020-02-18
- 0.2.3-beta.1 (beta) — 2019-03-28
- 0.2.4 — 2019-03-29
- 0.2.3 — 2019-03-28
- 0.2.2-beta.1 — 2019-03-28
- 0.2.1 — 2019-01-22
- 0.2.0 — 2018-06-20
- 0.2.0-alpha.2 — 2018-06-20
- 0.2.0-alpha.1 — 2018-06-20
- 0.1.3 — 2017-08-29
- 0.1.2 — 2017-08-26
- 0.1.0 — 2017-08-11
- 0.0.4 — 2017-07-06
- 0.0.3 — 2017-07-06
- 0.0.2 — 2017-06-29
- … 1 more at https://npm.io/package/ngx-select2/versions

## README

# ngx-select2
Select2 component for Angular

[![peerDependencies Status](https://david-dm.org/lon-yang/ngx-select2/peer-status.svg)](https://david-dm.org/lon-yang/ngx-select2?type=peer)
[![npm version](https://badge.fury.io/js/ngx-select2.svg)](https://badge.fury.io/js/ngx-select2)
[![licence](https://img.shields.io/npm/l/ngx-select2.svg)](https://opensource.org/licenses/Apache2.0)

# Usage

- Add `jQuery` and `Select2` lib

```html
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
```

- Install `ngx-select2`

```bash
npm i ngx-select2
```

- Use select2 component

```ts
import { LSelect2Module } from 'ngx-select2';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    LSelect2Module
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
```
```html
<l-select2 [(ngModel)]="selected" [data]="data" [options]="options" [disabled]="false" (valueChange)="valueChange($event)"></l-select2>
```

# Options

- data: select2 init data for select
- options: select2 options
- disabled: disable select2 component
- valueChange: `output`. Fire on value change, same as `ngModelChange`

# ChangeLog

- `0.2.0`: Add `valueChange`, Support `Angular 6`
- `0.3.0`: Support `Angular 9`

---
_Source: https://npm.io/package/ngx-select2 · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._