Ionic input type=number decimal key resets input

@jangofett44 wrote:

Hello there! I’ve been developing in ionic 4, and this ‘bug’ is driving me crazy.

Ionic CLI 5.2.1
Angular 7.1.4
OS: Windows x64

Basically I put a ion-input type=“number” in HTML file of a page and when user clicks decimal button (’.’) input clears itself.

HTML Content:

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-menu-toggle>
        <ion-button>
          <ion-icon slot="icon-only" name="menu"></ion-icon>
        </ion-button>
      </ion-menu-toggle>
    </ion-buttons>
    <ion-title>Kasa Ekle</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-item>
    <ion-label position="floating">Bakiye</ion-label>
    <ion-input type="number" value="0"></ion-input>
  </ion-item>
  <ion-button expand="full" (click)="AddSafe()">Ekle</ion-button>
</ion-content>

Typescript Content:

import { Component, OnInit } from '@angular/core';
import { MbAcExchangeType } from 'src/app/classes/MbAcSafe';
import { Globals } from 'src/app/classes/Globals';
import { QuickToast } from 'src/app/classes/Helper';
import { ToastController } from '@ionic/angular';
import { Location } from '@angular/common';

@Component({
  selector: 'app-add-safe',
  templateUrl: './add-safe.page.html',
  styleUrls: ['./add-safe.page.scss'],
})
export class AddSafePage implements OnInit {
  public name : string;
  public exchange : number;
  public balance : number;
  
  public get exchanges(): MbAcExchangeType[] {
    return Globals.AppState.exchanges;
  }

  constructor(private toast : ToastController, private location : Location) { }

  ngOnInit() {
  }

  AddSafe()
  {
    Globals.AppState.AddSafe(this.name, this.exchange, this.balance)
    .then(() => {
      QuickToast(this.toast, "Kasa eklendi!", 3000);
      this.location.back();
    })
    .catch((e) => {
      QuickToast(this.toast, "Kasa eklerken hata, programı yeniden başlatmayı deneyin.", 3000);
      console.log(e);
    })
  }
}

I’ve also had another 2 inputs, but wanted to check if it works without them I deleted them.
This is the result:

decimal.gif353×661 43.6 KB

As seen on gif, pressing dot key causes input to clear, but when input is empty it causes dots to appear. I used scrcpy for screencast, so I tried to write with keyboard. Tried to input 12.0 but it still resets, entering 12,0 works tho. I also deleted ngModel in order to test if that was causing anything, but it still does not work. Any help?

Posts: 1

Participants: 1

Read full topic