Angular ngbDatepicker: How to include context in markDisabled

Question

I have an input field defined as ngbDatepicker. Some of the days should be disabled which is why I use [markDisabled]="getDisabledDays" like this:

<input type="text" [minDate]="getMinDate()"
        [maxDate]="maxDate" formControlName="deliverydate" #d="ngbDatepicker" 
        [markDisabled]="getDisabledDays" (click)="d.toggle()" required>
    
    
    getDisabledDays = function (date: NgbDate, current: { month: number }) {
       //returns hardcoded NgbDateStruct[] array with the days.
    }

Till now I had an hardcoded NgbDateStruct[] with the disabled days. I now want to fill that array dynamically which is why I have to access the components context by using "this". However, "this" is undefined in the functions scope and I cant access the properties I need. How can I solve that?

try use arrow flat: `getDisabledDays = (date: NgbDate, current: { month: number })=> { console.log(this.days)}` — Eliseo, Jul 26 '22 at 10:48

score 1 · Accepted Answer · edited Jul 05 '23 at 11:19

1

SOLUTION:

As suggested by Eliseo:

getDisabledDays = (date: NgbDate, current: { month: number })=> { console.log(this.days)}

The reason is, that the arrow function binds this to the context where it is first defined, which is the class context.

edited Jul 05 '23 at 11:19

cwillinx

537
2
13

answered Jul 26 '22 at 10:53

Alex

81
6

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jul 29 '22 at 03:38

Angular ngbDatepicker: How to include context in markDisabled

1 Answers1