首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何在angular-eonasdan-datetimepicker中使用链接的选择器?

如何在angular-eonasdan-datetimepicker中使用链接的选择器?
EN

Stack Overflow用户
提问于 2016-05-30 18:53:38
回答 1查看 997关注 0票数 0

我使用的是angular- eonasdan-datetimepicker,一个用于eonasdan-datetimepicker的angular包装器。如何使结束日期始终晚于开始日期。同时在结束日期日历中禁用开始日期之前的日期。

我尝试使用on-change事件来更新UI,但是没有发生。事件正在被调用,但值未更新。

在结束日期的onchange事件中:

$scope.FormName.enddate = $scope.startdate;

(FormName.elementName) =用户从模型中选择开始日期的值。

在jquery中,它使用:

代码语言:javascript
复制
<script type="text/javascript">
    $(function () {
        $('#datetimepicker6').datetimepicker();
        $('#datetimepicker7').datetimepicker({
            useCurrent: false //Important! See issue #1075
        });
        $("#datetimepicker6").on("dp.change", function (e) {
            $('#datetimepicker7').data("DateTimePicker").minDate(e.date);
        });
        $("#datetimepicker7").on("dp.change", function (e) {
            $('#datetimepicker6').data("DateTimePicker").maxDate(e.date);
        });
    });
</script>

angular包装器代码如下所示:

代码语言:javascript
复制
(function() {
  'use strict';

  var module = angular.module('ae-datetimepicker', []);

  module.directive('datetimepicker', [
      '$timeout',
      function($timeout) {
        return {
          require: '?ngModel',
          restrict: 'EA',
          scope: {
            options: '@',
            onChange: '&',
            onClick: '&'
          },
          link: function($scope, $element, $attrs, controller) {
            $element.on('dp.change', function() {
              $timeout(function() {
                var dtp = $element.data('DateTimePicker');
                controller.$setViewValue(dtp.date());
                $scope.onChange();
              });
            });

            $element.on('click', function() {
              $scope.onClick();
            });

            controller.$render = function () {
              if (!!controller) {
                if (controller.$viewValue === undefined) {
                  controller.$viewValue = null;
                }
                else if (!(controller.$viewValue instanceof moment)) {
                  controller.$viewValue = moment(controller.$viewValue);
                }
                $element.data('DateTimePicker').date(controller.$viewValue);
              }
            };


            $element.datetimepicker($scope.$eval($attrs.options));
          }
        };
      }
    ]);
})();

任何线索都会很有帮助。

EN

回答 1

Stack Overflow用户

发布于 2016-05-31 16:03:24

我想不需要传递lib的源代码:https://github.com/atais/angular-eonasdan-datetimepicker

我已经更新了lib,所以可以更容易地归档您所请求的内容。

基本上,现在options是一个对象,而不是JSON String,fe:

代码语言:javascript
复制
vm.options = {
    format: "DD.MM.YYYY",
    maxDate: dateTo
};

这些变化正在被关注和应用。演示的插入器在这里:http://plnkr.co/ZSjN8f

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/37523892

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档