<!-- Do not edit this file. It is automatically generated by API Documenter. -->

[Home](./index.md) &gt; [@digitalpersona/devices](./devices.md) &gt; [CardsReader](./devices.cardsreader.md) &gt; [on](./devices.cardsreader.on.md)

## CardsReader.on() method

Adds an event handler for the event. This is a multicast subscription, i.e. many handlers can be registered at once.

<b>Signature:</b>

```typescript
on<E extends Event>(event: string, handler: Handler<E>): Handler<E>;
```

## Parameters

|  Parameter | Type | Description |
|  --- | --- | --- |
|  event | <code>string</code> | a name of the event to subscribe, e.g. "CardInserted" |
|  handler | <code>Handler&lt;E&gt;</code> | an event handler. |

<b>Returns:</b>

`Handler<E>`

an event handler reference. Store the reference and pass it to the [CardsReader.off()](./devices.cardsreader.off.md) to unsubscribe from the event.

## Example


```
class CardComponent
{
    private reader: CardsReader;

    private onCardInserted = (event: CardInserted) => { ... }
    private onCardRemoved = (event: CardRemoved) => { ... }
    ...

    public async $onInit() {
        this.reader = new CardsReader();
        this.reader.on("CardInserted", this.onCardInserted);
        this.reader.on("CardRemoved", this.onCardRemoved);
        ...
        await this.cardReader.subscribe()
    }
    public async $onDestroy() {
        await this.cardReader.unsubscribe();
        this.reader.off("CardInserted", this.onCardInserted);
        this.reader.off("CardRemoved", this.onCardRemoved);
        ...
        // alternatively, call this.reader.off() to unsubscribe from all events at once.
        delete this.reader;
    }
}

```