Ionic-v4 input type=number shows spinner

I have been using ionicv4 beta for development
when I try this

<ion-input [(ngModel)]="userphone" type="number" name="phone" #phone="ngModel"  spellcheck="false" 
        pattern="/(7\d|8\d|9\d)\d{9}$/" required>

I get the increment/decrement buttons as a spinner on the right side of the HTML.

I tried using the following n the global CSS but still, it doesn’t solve the problem.

input[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0; 

The above CSS doesn’t show the increment/decrement buttons when we use HTML input element

<input type="number"></input>
instead of
<ion-input type="number></ion-input>

but I have been using a floating label which requires <ion-input>

Can anyone help me on this?

1 Like


1 year later… same question.