CODEWITHSUNDEEP
htmlangular
dizzydizzy
dizzydizzy

Reputation: 157

debounce (AfterValueChanged) Not working properly

I'm tryig to create a field that evaluates it's content some time after I stopped typing data into it. I was able to make it work in a previous form with this:

<div class="input-field">
<input type="text" [(ngModel)]="distance" 
[floatInput]="true" 
[ngClass]="{ 'invalid': ( form.get( 'distance' ).hasError('required') ) }" [formControl]="form.get( 'distance' )" 
debounce (afterValueChanged)="setDistance( distance )"  
min="2" value="1" >
</div>

The debounce part is the important one. This works as intended. However, I need to make it work on another field, and it does not work at all. The HTML looks like this:

<div class="input-field centerblock fullwidth">
<input type="text" 
[disabled]="!editable" 
[floatInput]="true" placeholder="0.00" 
[id]="'oap'+pos" [(ngModel)]="item.monto" 
debounce (afterValueChanged)="montoActualizado( $event.target.value, item)" >
</div>

Does anyone know why this could not be working?

Upvotes: 1

Views: 225

Answers (1)

StepUp
StepUp

Reputation: 38094

It looks like you've forgot to add [formControl]="form.get( 'item.monto' )":

<div class="input-field centerblock fullwidth">
<input type="text" 
[disabled]="!editable"
[formControl]="form.get( 'item.monto' )" 
[floatInput]="true" placeholder="0.00" 
[id]="'oap'+pos" [(ngModel)]="item.monto" 
debounce (afterValueChanged)="montoActualizado( $event.target.value, item)" >
</div>

Upvotes: 1

Related Questions