How to overcome the infinite loop on method of property binding

Issue replication step

The ‘workDays’ property is given by property binding usingthrough the method aslike below code. The Scheduler will be flickered and re-rendered multiple times.

1. In src/app.component.html file.

   [workDays]="getWorkDays()"
   

2. In src/app.component.ts file.

   public getWorkDays() {
     let workDays = [1,2,3];
     return workDays;
   }
   

To prevent the Schedule re-rendering

1. Need to import the ‘ChangeDetectionStrategy’ package from the ‘@angular/core’ in app.component.ts file as follows.like below.

   import { Component, ChangeDetectionStrategy } from '@angular/core';
   

2. Use ‘ChangeDetectionStrategy.OnPush’ as the followinglike below code snippet.

@Component({
   selector: ‘app-root’,
   providers: [WeekService, MonthService, ResizeService, DragAndDropService],
   changeDetection: ChangeDetectionStrategy.OnPush
})

Please rRefer to the example from the following GitHub link.

Example – Scheduler with workDays property