Получение только первых нескольких символов при получении входного значения с помощью события Ionic 4 Keypress со сканером - PullRequest
0 голосов
/ 06 мая 2019

Я внедряю iOS-приложение на базе ionic 4, специально разработанное для iPad.Приложение отправляет данные штрих-кода на сервер, отсканированные с помощью беспроводного сканера, подключенного через Bluetooth к приложению.Чтобы включить автосохранение, я написал метод захвата событий нажатие клавиши , который обнаруживает нажатие клавиши «ввод» на сканере.Когда он обнаруживает «ключ ввода», данные автоматически отправляются на внутренний сервер.

Вот мой HTML

<ion-item>
          <ion-label position = "floating" class="lab-font">Order/Tracking/UCC No.<ion-note style="color: red">*</ion-note></ion-label>
          <ion-input #order type = "text" text-uppercase formControlName = "order" (ionFocus) = "enableKey()" (ionBlur) = "scanOrder($event)" 
              (ionInput) = "checkRepeat()" (keypress)="handleKeyboardEvent($event)" class="lab-font" required ></ion-input>
        </ion-item>

Нажатие клавиши запускается с помощью (keypress) = "handleKeyboardEvent ($ event)"

В файле Typescript у меня есть

 handleKeyboardEvent(event: KeyboardEvent) {
    if(event.key.toLowerCase() === "enter"){
      this.submitOrderSearch(this.order.value);
    }
  }

Когда мы вручную набираем текст с помощью виртуальной клавиатуры, это прекрасно работает.Но когда мы используем сканер (беспроводной, Bluetooth, подключенный к iPAD, используется в качестве устройства ввода) и сканируем штрих-код, последние несколько символов пропускаются при вызове метода submitOrderSearch.

Будет ли задержка при привязке значения к полю ввода?Поскольку сканеры считывают данные довольно быстро, и я вижу, что метод определяет клавишу ввода, как только сканер подает звуковой сигнал.Или я что-то здесь упускаю?

Ниже я использую штрих-код.

enter image description here

1 Ответ

0 голосов
/ 08 мая 2019

Сейчас мы работаем над этой проблемой с Timeout.Я не уверен, является ли это правильным подходом, но пока ничто другое не работает с надежностью.

В сценарии типа я изменил это на

  //Method to handle enter event
  handleScanner(evt){
    setTimeout(() => {
      let value = evt.target.value;
      this.enterEvt = true;
      this.submitOrderSearch(value);
    },800);
  }

и в HTML

<ion-input #order type = "text" text-uppercase formControlName = "order" 
              (ionInput) = "enableSerialNumbers($event)"  class="lab-font" (keyup.enter)="handleScanner($event)" required ></ion-input>

В основном привязка происходит немного медленнее, чем само событие.Так что небольшая задержка гарантирует, что значение правильно привязано к элементу управления.Другой способ заключается в буферизации нажатой клавиши и использовании буфера для преобразования в строку при нажатии клавиши ввода.

...