如何在 nb-rangepicker 选择的 rangepicker 1 日期后设置最多 3 天

Question

我使用星云日期范围选择器过滤数据，它工作正常。 目前，我想在我首先选择输入后 3 天设置默认 maxDate 我尝试了很多方法但对我不起作用。 这是我的 TypeScript 代码

  import { Component } from '@angular/core';
    import { FormControl } from '@angular/forms';
    import { NbDateService } from '@nebular/theme';
    
    @Component({
      selector: 'nb-datepicker-showcase',
      template: `
        <nb-card size="large">
          <nb-card-body>
            <input nbInput placeholder="Pick Date" [nbDatepicker]="formpicker">
            <nb-rangepicker #formpicker></nb-rangepicker>
          </nb-card-body>
        </nb-card>
      `,
      styleUrls: ['./datepicker-example.scss'],
    })
    export class DatepickerShowcaseComponent {
    min: Date;
    max: Date;
  constructor(protected dateService: NbDateService<Date>) {
    this.min = this.dateService.addDay(this.dateService.today(), -2);
    this.max = this.dateService.addDay(this.dateService.today(), 2);
  }
    }

我也尝试使用最小、最大日期但对我不起作用

<input nbInput placeholder="Pick Date" [nbDatepicker]="picker">
<nb-rangepicker #picker [min]="min" [max]="max"></nb-rangepicker>

Answer 1

您必须在控制器中声明最大日期。

max: Date = new Date();
max.setDate(new Date(this.min).getDate() + 2);

Answer 2

您可以在 nb-rangepicker 元素上使用 (rangeChange) 事件侦听器，然后操作您的日期对象

<nb-rangepicker (rangeChange)="manipulateDate($event)" #dateRangePicker></nb-rangepicker>