Angular material input matInput casella solo numerica

Nel caso che si sta usando il controllo di testo input Matinput di Angular Material, e vogliamo renderla solo numerica, oltre ad impostare la proprietà type su number, dobbiamo gestire anche il dato che si sta digitando. La casella di testo permette l'inserimento oltre dei numeri, anche dei simboli + e -.

Per evitare l'inserimento di questi simboli, occorre gestire l'evento keypress il tipo di dato digitato.

Di seguito il frammento di codice html relativo all'inserimento di soli numeri. 

HTML

 <input matInput

        type="number"

       

        (keypress)="($event.charCode >= 48 &&

$event.charCode < 58)"

        >