Как разрешить текстовому полю принимать шаблон от 0-6 и X на входе с максимальной длиной 6?

Question

У меня есть текстовое поле, которое будет принимать только цифры от 0-6 и алфавит 'X' (0,1,2,3,4,5,6, X) и maxlength 6. Как это сделать в angular ?

<tr *ngFor="let lists of resObj;let i = index">
        <td>
        <input type="number" [(ngModel)]="lists.from" (ngModelChange)="onHandle($event, 'from', lists)" maxlength="1"
                          onKeyPress="if(this.value.length===2) return false;"
                          onKeyUp="if(this.value>6){this.value=6;}else if(this.value<0){this.value=0;}" />
          </td>
        </tr>

Answer 1

<tr *ngFor="let lists of resObj;let i = index">
        <td>
        <input type="number" [(ngModel)]="lists.from" (ngModelChange)="onHandle($event, 'from', lists)" maxlength="1" (keyup)="numeric()" id="from-value" />
          </td>
        </tr>

 numeric() {
    var x = document.getElementById("rhi-value") as HTMLInputElement
    x.value = x.value.replace(/[^0-6X]/g, '');
  }