是否可以在 angular daterangepicker 中设置动态范围?

Is it possible to make dynamic range in angular daterangepicker?

通常情况下:

vm.datePickerRangeOptions = {
  ranges: {
    'Today': [moment(), moment()]
  }
};

就足够了。这样我就定义了今天开始和结束日期的范围。一旦时间过去,就会出现问题:当页面未刷新时,范围 'Today' 仍然指向页面呈现的日期。

到目前为止我尝试的是添加一些事件处理程序:

vm.datePickerRangeOptions = {
  ranges: {
    'Today': [moment(), moment()]
  },
  eventHandlers: {
    'show.daterangepicker': a
  },
};

function a() {
   vm.datePickerRangeOptions.ranges = {
     'Today': [moment(), moment()]
  };
}

但一旦显示日期选择器,它就会立即关闭。

第二种方法是将 vm.dateRangePickerOptions 设置为函数并在输入视图中设置为 option。杰斯:

vm.dateRangePickerOptions = function() {
  return {
    ranges: {
      'Today': [moment(), moment()]
    }
  }
}

和模板:

<input date-range-picker name="daterange" ng-model="vm.datePicker.date"
       options="vm.datePickerRangeOptions()">

在这种情况下,我收到来自 moment.js 的错误消息:

TypeError: can't convert undefined to object

Angular daterangepikcer is a wrapper for bootstrap daterangepicker and according to its creator it is not possible (issues: #1137, #1516).

要更新日期范围值,可以将它们设置在某个时间间隔内。例如:

function updateRanges() {
  vm.datePickerRangeOptions.ranges = {
    'Today': [moment(), moment()],
  }

  var now = moment();
  var startOfTomorrow = moment().add(1, 'day').startOf('day');
  $timeout(updateRanges, startOfTomorrow.diff(now));
}

旁注:如果您想更新日期范围并且已经设置了 maxDate,请不要忘记在时间间隔内也进行更新。