Angular Syncfusion schedule cannot invoke an object which is possibly 'undefined

Question

I am working on Angular Syncfusion for allowing user to show and book appoinments and following below link https://ej2.syncfusion.com/angular/documentation/schedule/editor-template/#how-to-prevent-the-display-of-editor-and-quick-popups

Below is my code.

<ejs-schedule #scheduleObj   class="schedule" cssClass='schedule-group-custom-work-days' width='100%' height='650px'
[selectedDate]="selectedDate" [workDays]='workWeekDays' (popupOpen)='onPopupOpen($event)' [eventSettings]='eventSettings' showQuickInfo]='showQuickInfo'
[allowResizing]=true ></ejs-schedule>

  @ViewChild('scheduleObj')
  public scheduleObj!: ScheduleComponent;
  public eventSettings: EventSettingsModel = { dataSource: [] };
  selectedTileDate: any;
  public selectedDate: Date = new Date();
  public showQuickInfo: Boolean = window.innerWidth > 1024 ? false : true;


 public onPopupOpen(args: PopupOpenEventArgs): void {
}

But I am getting error Cannot invoke an object which is possibly 'undefined'. I am able to resolve this error by doing below in tsconfig.json

"angularCompilerOptions": {
   ...,
   "strictTemplates": false
}

But then it is disabling the strict check in my whole application. Is there a better way to deal with it?

Answer 1

We have validated your reported issue and suggest you set “strictNullChecks” to false in the “complierOptions” in the tsconfig.json file like below to overcome the issue.

tsconfig.json

"compilerOptions": {

    .

    .

    .

    .

    .

"strictNullChecks": false,

}

Kindly try the above solution and let us know if you need any assistance.