¿podrían ayudarme?.
Varan tengo este formulario
<form action="" method="post" enctype="multipart/form-data" class="form-horizontal" #f="ngForm"
enctype="multipart/form-data">
<div class="alert alert-danger mt-1 alert-dismissible" role="alert" *ngIf="ValidacionMessage">
Por Favor verifique los campos marcados con *
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<!-- Nombre -->
<div class="form-group row mx-1">
<label class="col-md-3 col-form-label" for="text-input">Nombre*</label>
<div class="col-md-9">
<input [disabled]="accion === 'view'" type="text" name="nombre" class="form-control"
placeholder="Nombre" [(ngModel)]="empresa.nombre" required>
</div>
</div>
<!-- Nombre -->
<!-- Direccion -->
<div class="form-group row mx-1">
<label class="col-md-3 col-form-label" for="text-input">Direccion*</label>
<div class="col-md-9">
<input [disabled]="accion === 'view'" type="text" name="direccion" class="form-control"
placeholder="Direccion" [(ngModel)]="empresa.direccion" required>
</div>
</div>
<!-- Direccion -->
<!-- Registro Fiscal -->
<div class="form-group row mx-1">
<label class="col-md-3 col-form-label" for="text-input">Registro Fiscal*</label>
<div class="col-md-9">
<input [disabled]="accion === 'view'" type="text" name="registro" class="form-control"
placeholder="Registro" [(ngModel)]="empresa.registroFiscal" required>
</div>
</div>
<!-- Registro Fiscal -->
<!-- Telefono -->
<div class="form-group row mx-1">
<label class="col-md-3 col-form-label" for="text-input">Telefono*</label>
<div class="col-md-9">
<input [disabled]="accion === 'view'" type="text" name="telefono" class="form-control"
placeholder="telefono" [(ngModel)]="empresa.telefono">
</div>
</div>
<!-- Telefono -->
<!-- Tamaño -->
<div class="form-group row mx-1">
<label class="col-md-3 col-form-label" for="text-input">Tamaño*</label>
<div class="col-md-9">
<select [disabled]="accion === 'view'" class="form-control" [(ngModel)]="empresa.tamanoEmpresa_id"
name="tamano">
<option value="1">Pequeña</option>
<option value="2">Mediana</option>
<option value="3">Grande</option>
</select>
</div>
</div>
<!-- Tamaño-->
<!-- NIT -->
<div class="form-group row mx-1">
<label class="col-md-3 col-form-label" for="text-input">NIT*</label>
<div class="col-md-9">
<input [disabled]="accion === 'view'" type="text" name="nit" class="form-control"
placeholder="Numero de NIT" [(ngModel)]="empresa.nit">
</div>
</div>
<!--NIT -->
<!-- Logo -->
<div class="form-group row mx-1" *ngIf=" accion !== 'view'">
<label class="col-md-3 col-form-label" for="text-input">Logo*</label>
<div class="col-md-9">
<div class="custom-file">
<input [disabled]="accion === 'view'" type="file" class="custom-file-input" name="logo"
[(ngModel)]="empresa.logo">
<label class="custom-file-label" for="customFile">Elige un Logo</label>
</div>
</div>
</div>
<!--Logo -->
<!--Razon -->
<div class="form-group row mx-1">
<label class="col-md-3 col-form-label" for="text-input">Razon Social*</label>
<div class="col-md-9">
<input [disabled]="accion === 'view'" type="text" name="razon" class="form-control"
placeholder="Razon Social" [(ngModel)]="empresa.razonSocial">
</div>
</div>
<!--Razon -->
<!--Giro -->
<div class="form-group row mx-1">
<label class="col-md-3 col-form-label" for="text-input">Giro*</label>
<div class="col-md-9">
<input [disabled]="accion === 'view'" type="text" name="giro" class="form-control"
placeholder="Giro" [(ngModel)]="empresa.giro">
</div>
</div>
<!--Giro -->
<!--Email -->
<div class="form-group row mx-1">
<label class="col-md-3 col-form-label" for="text-input">Email*</label>
<div class="col-md-9">
<input [disabled]="accion === 'view'" type="text" name="Email" class="form-control"
placeholder="Email" [(ngModel)]="empresa.email" email>
</div>
</div>
<div class="modal-footer">
<button *ngIf="accion === 'create'" type="button" class="btn btn-secondary" data-dismiss="modal"
(click)="limpiar()">Limpiar</button>
<button *ngIf="accion === 'create'" type="button" (click)="agregarEmpresa(f)" class="btn btn-primary"
name="guardar">Guardar</button>
<button *ngIf="accion === 'editar'" type="button" (click)="editarEmpresa(f)" class="btn btn-primary"
name="Editar">Guardar Cambios</button>
<button *ngIf="accion === 'view'" type="button" (click)="bsModalRef.hide()" class="btn btn-secondary"
name="Editar">Cerrar</button>
</div>
</form>
Y quisiera poder bloquear los campos registro fiscal, teléfono y nit a solamente números, me refiero a que no sea posible introducir letras ni otros caracteres, así mismo también quisiera poder auto completar un - en estos campos para ayudar al usuario, pero no realmente como hacerlo, he tratado poner type="number" pero me aparece al costado unos controles para subir y bajar números que tampoco se como quitarlos, ¿Me pueden brindar ayudar por favor?, no he encontrado como hacer esto utilizando Angular.