Предупреждение Angular Calendar: NG0956 — отслеживание по идентификатору приводило к повторному созданию всей коллекции

Я использую nz-calendar от ng-zorro-antd в своем приложении Angular. Каждый раз, когда я нажимаю на дату в календаре, я получаю в консоли следующее предупреждение:

NG0956: настроенное выражение отслеживания (отслеживание по идентификатору) вызвало повторное создание всей коллекции размером 7. Это дорогостоящая операция, требующая уничтожения и последующего создания узлов DOM, директив, компонентов и т. д. Просмотрите «выражение отслеживания» и убедитесь, что он однозначно идентифицирует элементы в коллекции. Дополнительную информацию можно найти на сайте https://angular.dev/errors/NG0956.

Мой HTML:

<nz-calendar [nzFullscreen] = "false" [(ngModel)] = "currentDate" [nzCustomHeader] = "customHeader"
  (nzSelectChange) = "onDateChange($event)" nzTooltipVisible = "false">
  <div class = "dot" *nzDateCell = "let date;" style = "list-style: none;">
    <nz-badge *ngIf = "isSelected(date)" nzStatus = "warning"></nz-badge>
  </div>
</nz-calendar>

Компонент:

currentDate: Date = this.calendarService.getCurrentDate();
selectedDates: Set<string> = new Set<string>();

isSelected(date: Date): boolean {
    const formattedDate = date.toISOString();
    const isMatched = this.selectedDates.has(formattedDate);

    return isMatched;
}

onDateChange(newDate: Date): void {
  console.info('newDate :>> ', newDate);
  this.calendarService.setCurrentDate(newDate);
}

updateSelectedDates(data: any): void {
  this.selectedDates.clear();
  data.forEach((appointment: any) => {
    const appointmentDate = new Date(appointment.appointment_date);
    appointmentDate.setHours(0, 0, 0, 0);
    this.selectedDates.add(appointmentDate.toISOString());
  });
  this.cdr.markForCheck();
}

Услуга:

private currentDate = new BehaviorSubject<Date>(new Date());

getCurrentDate(): Date {
  return this.currentDate.value;
}

Зависимости:

"dependencies": {
  "@angular/animations": "^18.0.0",
  "@angular/cdk": "^18.0.6",
  "@angular/common": "^18.0.0",
  "@angular/compiler": "^18.0.0",
  "@angular/core": "^18.0.0",
  "@angular/forms": "^18.0.0",
  "@angular/material": "^18.0.6",
  "@angular/platform-browser": "^18.0.0",
  "@angular/platform-browser-dynamic": "^18.0.0",
  "@angular/router": "^18.0.0",
  "ng-zorro-antd": "^18.0.1",
  "ngx-perfect-scrollbar": "^10.1.1",
  "ngx-scrollbar": "^15.1.2",
  "rxjs": "~7.8.0",
  "socket.io-client": "^4.7.5",
  "tslib": "^2.3.0",
  "zone.js": "~0.14.3"

 "devDependencies": {
    "@angular-devkit/build-angular": "^18.0.7",
    "@angular/cli": "^18.0.7",
    "@angular/compiler-cli": "^18.0.0",
    "@types/jasmine": "~5.1.0",
    "jasmine-core": "~5.1.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.1.0",
    "typescript": "~5.4.2"
  }
}

Проблема: Я подозреваю, что предупреждение связано с тем, как Angular отслеживает элементы nzDateCell, вызывая повторное создание узлов DOM, когда я нажимаю на дату. Я пробовал использовать trackBy, но не знаю, как реализовать это с помощью nzDateCell.

Вопрос: Как я могу правильно использовать trackBy с nzDateCell или иным образом решить эту проблему, чтобы избежать повторного создания всей коллекции каждый раз при нажатии даты?

🤔 А знаете ли вы, что...
Angular разработан и поддерживается командой разработчиков из Google.