Typescript + Html: How to force uppercase in an input field

Issue

I'm working with angular (typescript) and I have a modelform in html where the user has to insert a code field and a description field.

The code field must always be entered by the user, always in uppercase.

I found and followed this question: How to convert input value to uppercase in angular 2 (value passing to ngControl)

but the last letter that the user inserts remains lowercase however .. The fundamental thing is that the database always comes in all uppercase (I also put a limit of 4 characters that works properly) this is my code now, but as written above it does not work properly:

<input type="text" id="code" #code class="form-control" formControlName="code" maxlength="4"
                 (input)="code.value=$event.target.value.toUpperCase()">

has anyone found a quick, functional and fast solution?

thank you!

Solution

You can simply add oninput="this.value = this.value.toUpperCase()" in your <input> tag and it will instantly convert any input in your input field to Uppercase.

Answered By - Ali Heikal