Enter your email address or phone number Same Texbox - using Mask

address.Module.ts
-------------------
import {NgxMaskModule} from 'ngx-mask';

@NgModule({
    imports: [
      NgxMaskModule,

    ],
   
address.component.html
----------------------------
<form style="margin-top: -18px !important;" method="post" [formGroup]="authForm" (ngSubmit)="submitForm()">

<input class="form-control " [ngClass]="{'mob-box': type == 'number'}" formControlName="username"  [(ngModel)]="username" type="text" required placeholder="Enter your email address or Mobile number" (keyup)='Onchange($event)' [mask]="setmask">

<select id="code" class="IP" placeholder="enter your phone code" maxlength="4" name="code"  [(ngModel)]="fors.code"
[ngClass]="{'vis': type == 'number','viss': type != 'number'}" #code="ngModel"
(ngModelChange)="authForm.value.username='';checkphone($event)">
<option value="91">+ 91 </option>
<option value="1">+ 1</option>
<option value="44">+ 44</option>
</select>
</form>

address.component.ts
----------------------------
  setmask:any = ''
  Onchange(event){
    if(event.keycode != 8){
      let targetvalue = event.target.value.replace(/[^a-zA-Z0-9]/g,'');
      if(isNaN(targetvalue) || targetvalue==''){
        this.type = 'email'
        this.setmask = ""
      }
      else
        this.type = 'number'
    }
    else{
      if(event.target.value.length > 0)
        this.type = 'email'
        this.setmask = ""
    }
    if(this.type == 'email')
    this.code = undefined
    else{
      if(this.code == '1' || this.code == undefined || this.code == null){
        this.code = '1'
        this.checkphone('1')
      }
      else{
        this.code = this.code
        this.checkphone(this.code)
      }
    }
   
  }
  checkphone(code){
    if(this.type == 'number'){
      if(code == "44"){ 
        this.setmask = '00000 000000'
      }else{
        this.setmask = '(000) 000-0000'
      }
    }
  }