Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Global configuration of datepickers minDate and MaxDate example is misleading #3848

Open
pveliz opened this issue Sep 6, 2020 · 3 comments · May be fixed by #4620
Open

Global configuration of datepickers minDate and MaxDate example is misleading #3848

pveliz opened this issue Sep 6, 2020 · 3 comments · May be fixed by #4620

Comments

@pveliz
Copy link

pveliz commented Sep 6, 2020

Bug description:

Hi, Maybe I'm wrong, but it seems that this example is misleading about minDate and maxDate

https://ng-bootstrap.github.io/#/components/datepicker/examples#config

When trying to customize minDate and MaxDate this config is not working even in StackBlitz

// customize default values of datepickers used by this component tree
config.minDate = {year: 1900, month: 1, day: 1};
config.maxDate = {year: 2099, month: 12, day: 31};

I end up using NgbDatepickerConfig instead of NgbInputDatepickerConfig

Link to minimally-working StackBlitz that reproduces the issue:

https://stackblitz.com/run?file=app/datepicker-config.ts

Versions of Angular, ng-bootstrap and Bootstrap:

Angular: 10.0.0

ng-bootstrap: v7.0.0

Bootstrap: 4.5.0

@benouat
Copy link
Member

benouat commented Sep 9, 2020

Hey @pveliz

I don't think you're wrong! 😆 This demo seems to be broken, I mean, none of the overrides are taken into account.
We definitely might have an issue with NgbInputDatepickerConfig

@alexisAvenel
Copy link

+1

@talamaska
Copy link

talamaska commented May 19, 2023

I provide both configs NgbDatepickerConfig and NgbInputDatepickerConfig. Still minDate and maxDate are not taken into account.
But, If I make a directive that attaches the minDate and maxDate attributes to the element (an input that has the ngbDatepicker directive) it works. It's a bit hacky and I would prefer to centralize this in the config how the interface suggests.

here is my config. Maybe I'm doing something wrong?

@Injectable({
  providedIn: 'root'
})
export class AppNgbDatepickerConfig extends NgbDatepickerConfig {
  showWeekNumbers = false;
  firstDayOfWeek = 7;
  weekdays: TranslationWidth.Abbreviated;
  minDate: NgbDateStruct;
  maxDate: NgbDateStruct;
  public minDateMoment: Date = moment().subtract(10, 'years').endOf('year').toDate();
  public maxDateMoment: Date = moment().add(10, 'years').endOf('year').toDate();
  constructor() {
    super();
    const minDateStruct = { year: this.minDateMoment.getFullYear(), month: this.minDateMoment.getMonth() + 1, day: this.minDateMoment.getDate() };
    const maxDateStruct = { year: this.maxDateMoment.getFullYear(), month: this.maxDateMoment.getMonth() + 1, day: this.maxDateMoment.getDate() };
    this.minDate = minDateStruct;
    this.maxDate = maxDateStruct;
  }
}

@bastienmoulia bastienmoulia linked a pull request Nov 14, 2023 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants