title: Input event and reactive forms of angular
body: <p>I have an input linked to an angular form, which uses an input event to call a function that converts to uppercase and validates that only letters and spaces are written, but in the form the last character is always left without converting or replacing, even when the function returns the correct value.</p>
  
  <p><code>&lt;input id="name" type="text" maxlength="60" (input)="funciones.convertOnlyText($event)" pInputText formControlName="name"&gt;</code></p>
  
  <pre><code>convertOnlyText(event) {        
          event.target.value = event.target.value.replace(/[^A-ZÁÉÍÓÚÑ a-záéíóúñ]+/g, '').trimLeft();
          let start = event.target.selectionStart;
          event.target.value = event.target.value.toUpperCase();
          event.target.selectionStart = start;
          event.target.selectionEnd = start;
  }
  </code></pre>
  
  <pre><code>this.form = new FormGroup({
      name: new FormControl({ value: null, disabled: false }, [Validators.required]),    
  });
  </code></pre>
  
  <p>for example, if I write hello* in the input, the function returns HELLO, but in the form it would be HELLO*, or if I write only hello, the function returns HELLO but in the form it is HELLo.</p>