How to bind an event on input text contains data

Question

in the below posted html code, i have an tag and i want to know how can i bind on the occurence of the event that indicates that the input text tag is fired. in other words.i want to fire or emit an event on the input tag is filled with data, something like binding on (click) event in buttons please let me know how to do that

code:

<span class="classOriginLat">
  <label for="originLatLabel">origin Latitude:</label>
  <input type="text" class="classInputOriginLat"id="originLatTextId" name="originLatText" required [(ngModel)]=IMeasurementCoordinates.originLat>
</span>

You may bind like this ``. This expects `onInputChange(e)` method to be defined in controller. — Wazeed, Apr 09 '21 at 08:21

score 0 · Answer 1 · answered Apr 09 '21 at 08:25

0

HTML Template

<input (change)="onInputChange($event)"/>

Controller method for the event

onInputChange(e) {
 console.log('input change event data', e);
}

answered Apr 09 '21 at 08:25

Wazeed

1,230
1
8
9

score 0 · Answer 2 · answered Apr 09 '21 at 08:33

oninput can be your solution.

var txtInputFilled = false;

function print(element) {
  if(element.value.length > 0) {
    console.log(element.value);
    txtInputFilled = true;
  }
  else {
    txtInputFilled = false;
  }
}

function check() {
  console.log("text input filled : " + txtInputFilled);
}

<input id="txt" type="text" oninput="print(this);"/>
<button type="button" onclick="check();">check</button>

Take a look at the answer from similar question for various input cases.

How to bind an event on input text contains data

2 Answers2

HTML Template

Controller method for the event