Ion-input as number - is this a bug or is it supposed to work like this?

If I have

first: number = 2;
second: number = 2;
third: number = 2;
fourth: number = 2;

in my component and in my template I have:

<input type="number" [(ngModel)]="first">
<input type="number" [(ngModel)]="second">
<h1>{{first + second}}</h1>

<ion-input type="number" [(ngModel)]="third"></ion-input>
<ion-input type="number" [(ngModel)]="fourth"></ion-input>
<h1>{{third + fourth}}</h1>

both calculations initially work i.e I get 4 and 4

However, once you type into the ion-item inputs they become text strings and the totals are concatonated i.e if I type in 3 and 3 I get a total of 33.

Are ion-inputs always string values once they have been entered/updated?

framework #7221 suggests “bug”.

1 Like