I am using Ionic3, and have:

        <ion-textarea (change)="reviewChange()"></ion-textarea>

When a user changes the input, and blurs focus from the text area, the reviewChange() function is triggered as expected.

Question

Is it possible to add an equivalent of the ion-searchbar's ionInput event? i.e. when a user types text, an event is triggered for each key pressed.

Background

I am trying to track how many characters a user has left. e.g.

500 characters left

In order to do so, I need to track each key stroke. Unless there's a better way, or some automated way to do this?

I am using Ionic3, and have:

        <ion-textarea (change)="reviewChange()"></ion-textarea>

When a user changes the input, and blurs focus from the text area, the reviewChange() function is triggered as expected.

Question

Is it possible to add an equivalent of the ion-searchbar's ionInput event? i.e. when a user types text, an event is triggered for each key pressed.

Background

I am trying to track how many characters a user has left. e.g.

500 characters left

In order to do so, I need to track each key stroke. Unless there's a better way, or some automated way to do this?

• javascript
• angular
• typescript
• ionic2
• ionic3

• You can use ngModel value length.. – Sunil B N Commented May 17, 2017 at 10:11
• The answer is here. stackoverflow./questions/20603107/… – Richard Commented May 17, 2017 at 10:12
• Thanks, just saw that. – Richard Commented May 17, 2017 at 10:12

2 Answers 2

An easier way would be to bind the text area to a property from the ponent

<ion-textarea maxlength="500" [(ngModel)]="myText"></ion-textarea>

And below that text area you can show the characters left like this

<span>{{ 500 - myText.length }} characters left</span>

You may simply try the (input) event. It fires for every key input.

     <ion-textarea [(ngModel)]="text" (input)="reviewChange()"></ion-textarea>