Заполнение нуля до поля ввода, но задержка на секунду - PullRequest
Новая
       17

Заполнение нуля до поля ввода, но задержка на секунду

0 голосов
/ 14 декабря 2018

У меня есть поле ввода для средства выбора даты - пользователь может вводить минуты, используя клавиатуру, и когда они вводят значение меньше 10, он автоматически добавляет начальный ноль - поэтому время 10:1 выглядит как 10:01(поле ввода часов и поле ввода минут) - у меня проблема в том, что он мгновенно отображает ноль, что затрудняет редактирование поля минут с разными значениями - как лучше всего отложить функцию displayMinute, используя тайм-аутили подобный метод, чтобы при вызове он задерживал выполнение этого на секунду или около того? 

// function to prepend 0 to a minute if the minute is under 10
Calendar.prototype.displayMinute = function (minute) {
   minute = (minute < 10) ? '0' + minute : minute;
   return minute;
};

template: "<input type=\"text\" (keyup)='updateMinuteInput($event)' [value]=\"displayMinute(currentMinute)\" >\n",

1 Ответ

0 голосов
/ 14 декабря 2018

Вместо обновления отображаемого значения вы должны обновить значение в базовом входе.

Затем можно использовать debounce для входного события, чтобы задержать его. 

class Calendar {

  constructor() {
    this.updateMinuteInput = EventEmitter();
    this.updateMinuteInput.debounceTime(1000).do(() => this.padMissingZero)
  }


  // function to prepend 0 to a minute if the minute is under 10
  padMissingZero = function () {
     minute = this.value.split(':')[1];
     if (minute === null || minute === undefined) return;
     minute = parseInt(minute, 10);
     minute = (minute < 10) ? '0' + minute : minute;
     this.value = this.value.split(':')[0] + minute
  };
}

template: "<input type=\"text\" [value]="value" (keyup)='updateMinuteInput($event)'>\n",

см. Angular и debounce для более полного примера

...