UnderScore to Space Directive

Only when typeof string

import {
  Directive,
  ElementRef,
  Input,
  OnChanges,
  OnInit,
  Renderer2,
  SimpleChanges,
} from '@angular/core';

@Directive({
  selector: '[appUnderscoreToSpace]',
})
export class UnderscoreToSpaceDirective implements OnInit, OnChanges {
  @Input('appUnderscoreToSpace') text?: string;

  constructor(private el: ElementRef, private renderer: Renderer2) {}

  private updateText(): void {
    if (typeof this.text === 'string') {
      const transformedText = this.text.replace(/_/g, ' ');
      this.renderer.setProperty(
        this.el.nativeElement,
        'textContent',
        transformedText
      );
    }
  }

  ngOnInit(): void {
    this.updateText();
  }

  ngOnChanges(changes: SimpleChanges): void {
    if (changes['text']) {
      this.updateText();
    }
  }
}