3

有没有办法为 Angular 的引导时间选择器设置最小时间和最大时间？使用 Angular 的 Datepicker 设置支持最小和最大日期，我想知道 Timepicker 是否允许类似的功能。

查看 Timepicker的 Angular 文档中的设置，似乎没有办法做到这一点......但只是想知道是否有人熟悉实现这种行为的方法。提前感谢您的见解/建议！

编辑：

为了提供更多关于我正在尝试做的事情的背景信息：

我有两个 Timepickers 并排。左侧的选择器允许用户选择开始时间，右侧的选择器允许用户选择结束时间。无论选择哪个开始时间都应该设置结束时间Timepicker的下限，无论选择哪个结束时间都应该设置开始时间Timepicker的上限。

4

1 回答 1

1

如果您的验证工作正常，您实际上只需要设置 minTime 或 maxTime ，因为一旦您的“开始”时间在“结束”时间之后，“结束”时间也在“开始”时间之前。

我想完全按照您的描述进行操作，并最终编写了一个指令来执行此操作。

我在“结束”时间选择器上选择了“minTime”作为我的属性，并将其设置为我的“开始”时间选择器的模型。然后该指令监视两个模型的变化，如果“开始”时间发生变化，则更新 minTime，并根据“开始”是否在“结束”之前设置模型验证。

只要设置了 ng-model，您也可以在 input[time] 元素上使用它。

我一开始尝试通过使用解析器和格式化程序来避免使用 $watch，但它最终没有将模型注册为无效，直到我下次更改它。

这是指令。随意做你想做的事情：

directive('minTime', function (){ 
    return {
        require: 'ngModel',
        restrict: 'A',
        link: function(scope, elem, attrs, ctrl) {
            var minTime;

            scope.$watch(attrs.minTime, function(newVal) {
                minTime = newVal;
                validate();
            });

            scope.$watch(attrs.ngModel, validate);

            function validate(value) {
                ctrl.$setValidity('minTime', (minTime < ctrl.$modelValue));
                return value;
            }
        }
    };
})
于 2014-12-11T21:21:07.627 回答