Angular 如何允许textbox在其输入中以maxlength 6接受0-6和X的模式？

我有一个文本框，它只接受0-6之间的数字和字母“X”（0,1,2,3,4,5,6,X）以及最大长度6。如何做到这一点在角

<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>

数字（）{
var x=document.getElementById（“rhi值”）作为HTMLInputElement
x、 value=x.value.替换（/[^0-6X]/g'）；
}

<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, '');
  }