Не удается найти свойство undefined

Question

Я получаю ошибку Невозможно прочитать свойство 'data' undefined в моем приложении angular 8 при вызове службы. Если я помещаю условие if в код компонента в моем компоненте, я не получаю ошибку, но если я ставлю условие if в html logi c, я все равно получаю ошибку. В чем проблема ?

UI

<div *ngIf="!hideEverything && !endOfAgreements && myData" class="agreementContainer">
  <ul class="agreementSectionList">
    <li *ngFor="let agreement of myData; let i=index;"
        class="agreementSection"
        [ngClass]="{
          'disabled': (i > activeBtn),
          'current': (i === activeBtn),
          'accepted': (i <= previousSection)
        }">
      <a> {{ agreement.code }}
        <ng-container *ngIf="i <= previousSection">
          <fa-icon [icon]="['fas', 'check-circle']" style="float: right;"></fa-icon>
        </ng-container>
        <ng-container *ngIf="i > previousSection">
          <fa-icon [icon]="['fas', 'window-close']" style="float: right;"></fa-icon>
        </ng-container>
      </a> <!-- (click)="termClicked(i)" -->
    </li>
  </ul>

Компонент

   ngOnInit() {
    this.getOutstandingAgreements(this.currentUser);
  }


  public getOutstandingAgreements(Id: number) {
    console.log(Id);
    this.agreementsService.getOutstandingAgreements(Id).subscribe((data: AgreementsModel[]) => {
         this.myData = data;
          // if (this.myData) {
         this.agreementData = this.myData[0].data;
         this.agreementLength = this.myData.length;

         this.calculateRemainingDaysLeft(0);
        } 
        );
    }

Answer 1

В компоненте объявите переменную myData, как показано ниже

myData = [];

и в html проверьте

<div *ngIf="!hideEverything && !endOfAgreements && myData.length > 0" class="agreementContainer">