2

我正在使用eonasdan datetimepicker,但无法从 Angular 控制器访问数据功能。

以下代码生成“TypeError:无法读取未定义的属性'setValue'”

var d = new Date();
d.setHours(d.getHours() - 8);
m = moment(d);
$("#datetimepicker").data("DateTimePicker").setValue(m);

由于在下一个代码中触发了 onChange 事件,因此问题不在选择器中。

    $("#datetimepicker").on("dp.change", function (e) {
        console.log(e.date._d););
    });

我发现 bootstrap-datetimepicker.js 定义了 DateTimePicker 数据,并实现了 setValue 函数。

 if (!$this.data('DateTimePicker')) {
                // create a private copy of the defaults object
                options = $.extend(true, {}, $.fn.datetimepicker.defaults, options);
                $this.data('DateTimePicker', dateTimePicker($this, options));
            }

setValue = function (targetMoment) 

我做错了什么?

4

1 回答 1

0

问题是我调用了$("#datetimepicker").data("DateTimePicker")外部 DOM。

通过实现一个具有隔离范围的指令来将 Ng-Model 绑定到 datetimepicker 来解决。

    .directive('timepicker', [
  function () {
      var link;
      link = function (scope, element, attr, ngModel) {
          element = $(element);
          element.datetimepicker({
              locale: 'sv',
              inline: true,
              sideBySide: true,
              stepping: 30,
              defaultDate: scope.date
          });
          element.on('dp.change', function (event) {
              scope.$apply(function () {                      
              scope.date = event.date._d;;
              });
          });
      };

      return {
          restrict: 'A',
          scope: {
              date: '=ngModel'
          },
          link: link        
      };
  }
    ])

正如 K.Toress 解释的那样,如何使用 ngmodel 在 datetimepicker 中设置默认日期?.

于 2016-09-29T10:08:21.360 回答