Угловой Bootstrap UI Timepicker ввод некорректного времени

Question

Я использую Угловой Bootstrap UI Timepicker входит 50 в поле часов, он выдвигает на первый план поля красного, но тем не менее я получаю правильную дату из него, который выглядит так же, как это Tue Nov 15 2016 05:00:55 GMT+0100.

Любые идеи, что я могу сделать? Благодаря!

Answer 1

В этом отношении вы могли бы рассмотреть возможность ограничить значения часа и минуты ввода, вот как настроить его для Timepicker

1) ввести пользовательские шаблон и указать атрибуты в min, max и validate-value для hour и minute элементы ввода, например:

<input type="text" placeholder="HH" validate-value min="1" max="12" ng-model="hours" ng-change="updateHours()" class="form-control text-center" ng-readonly="::readonlyInput" maxlength="2" tabindex="{{::tabindex}}" ng-disabled="noIncrementHours()" ng-blur="blur()"> 

2) реализуют validate-value директиву, чтобы ограничить числовые значения в элементе ввода:

.directive('validateValue', function() { 
    return { 
     require: 'ngModel', 
     link: function(scope, element, attrs, ngModelCtrl) { 

      ngModelCtrl.$parsers.unshift(function(viewValue) { 
       var min = Number(eval(attrs.min)); 
       var max = Number(eval(attrs.max)); 
       var value = Number(viewValue); 
       var valid = (!isNaN(value) && value >= min && value <= max); 

       if (!valid) { 
        var currentValue = ngModelCtrl.$modelValue.toString(); 
        ngModelCtrl.$setViewValue(currentValue); 
        ngModelCtrl.$render(); 
        return currentValue; 
       } 
       else { 
        return viewValue; 
       } 

      }); 
     } 
    }; 
}) 

Demo