角度引导UI Timepicker输入无效的时间

Question

我使用的角度引导UI Timepicker，如果我进入小时字段50，它突出了场红，但尽管如此，我得到一个有效的日期出来的，看起来就像那Tue Nov 15 2016 05:00:55 GMT+0100。

任何想法我可以做什么？谢谢！

Answer 1

对于这个问题，你可以考虑限制小时和分钟输入值，这里是如何自定义为Timepicker

1）引入定制模板和hour指定min，max和validate-value属性和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