Search code examples
angularangular7angular-directive

Using replace in Angular directive

import { Directive, ElementRef, HostListener } from '@angular/core';

@Directive({
  selector: '[mpnAadharDirective]'
})
export class GeneralDirective {

  constructor(private el: ElementRef) { }

  @HostListener('keyup') keyup() {
    console.log(this.el.nativeElement.value.replace(/\d(?=\d{4})/g, "*"))
  }
}

With the above code I'm trying to replace the nativeElement value, but I get the value printed but it is not replacing. I need some help in fixing this. Thank you.

Solution

  • Replacing event target value should works:

    @HostListener('keyup', ['$event']) keyup(event) {
  event.target['value'] = this.el.nativeElement.value.replace(/\d(?=\d{4})/g, "*");
}