I have this code for a textarea, it is working great with the ngModel and updating live, however i would like my-custom-directive to know when the model bound to this textarea is changing.
How can i detect a model change for this textarea in the my-custom-directive?
<textarea my-custom-directive class="green" [(ngModel)]="customertext"></textarea>
When we enter tags one character at a time, Angular performs change detection after every character is entered. So, if we type in “foo”, the Angular binding records for the <input> element value attribute will follow this sequence: "" , "f" , "fo" , "foo" .
In Angular, Directives are defined as classes that can add new behavior to the elements in the template or modify existing behavior. The purpose of Directives in Angular is to maneuver the DOM, be it by adding new elements to DOM or removing elements and even changing the appearance of the DOM elements.
Update
@Directive({
selector: 'xyz',
host: {'(ngModelChange)': 'doSomething($event)'}
})
export class Xyz {
doSomething(event){... }
}
Original
<textarea my-custom-directive class="green" [(ngModel)]="customertext"
(ngModelChange)="doSomething($event) "></textarea>
[(ngModel)]="customertext"
is the short form of
[ngModel]="customertext" (ngModelChange)="customertext=$event"
try add to your directive:
@HostListener('input') onInput() {
console.log('on input');
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With