question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Run MarkDisabled function manually

See original GitHub issue

Bug description:

I don’t know if this is a bug or not.

Now when a month in a datepicker is rendered the [markDisabled]. So when you have 3 months which you display, you have 90~ days. 90 times the markDisabled is fired and this is OK.

But now when I select a date for example (in an already rendered datepicker) I want to disable some dates again. My first thought was that I can run a function on the datepicker #template like setDisabledOnDays, but there is not a kind of function like that.

As a work arround iIdid the trick below! To Reinitialize the disabled days.

  private markDisabled() {
    this.dpDate.navigateTo({
      year: this.dpDate.months[0].year,
      month: this.dpDate.months[0].number - 3
    });

    this.dpDate.navigateTo({
      year: this.dpDate.months[0].year,
      month: this.dpDate.months[0].number + 3
    });
  }

Idea to create a function to run the markDisabled again?

Link to minimally-working plunker that reproduces the issue:

You can fork a plunker from one of our demos and use it as a starting point. Please note that we can not act on bug reports without a minimal reproduction scenario in plunker. Here is why: https://github.com/ng-bootstrap/ng-bootstrap#you-think-youve-found-a-bug

Version of Angular, ng-bootstrap, and Bootstrap:

Angular: 2.3.5

ng-bootstrap: 20

Bootstrap: 6

Issue Analytics

  • State:open
  • Created 7 years ago
  • Reactions:6
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

7reactions
maxokorokovcommented, Sep 28, 2018

@timmyrosen, a workaround might be to provide a new instance of the markDisabled function when you want the changes to be taken into account. Ugly, but should work.

Here is the stackblitz: https://stackblitz.com/edit/angular-li9grd

0reactions
yidingwwcommented, Apr 16, 2021

a workaround might be to provide a new instance of the markDisabled function when you want the changes to be taken into account

@maxokorokov

This works when u set [markDisabled] to the <ngb-datepicker>, but it does NOT work with the popup version (bind ngbDatepicker to an <input>).

I think it’s better to allow call markDisabled function manually. Or, can just make [markDisabled] function to be called eagerly (whenever user click any cells)

Read more comments on GitHub >

github_iconTop Results From Across the Web

Run MarkDisabled function manually - Bountysource
Run MarkDisabled function manually. ... Now when a month in a datepicker is rendered the [markDisabled]. So when you have 3 months which...
Read more >
Angular ngbDatepicker: How to include context in markDisabled
I now want to fill that array dynamically which is why I have to access the components context by using "this". However, "this"...
Read more >
NgbDatepicker - Angular powered Bootstrap
markDisabled. The callback to mark some dates as disabled. It is called for each new date when navigating to a different month.
Read more >
calendarsedros - npm
Start using calendarsedros in your project by running `npm i ... The callback function used to determine if the time should be marked...
Read more >
@ng-bootstrap/ng-bootstrap@14.0.0 - jsDocs.io
If there is a collapsing transition running already, ... false - the dropdown can only be closed manually via close() or toggle() methods....
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found