Typescript Angular переменная пуста в компоненте

Question

У меня есть веб-страница с al oop, вызывающим компонент примерно 10 раз. Я передаю данные в мой компонент, и он работает. Но вот моя проблема. В моем компоненте я хочу напечатать значение объекта, но оно всегда пустое.

В моем компоненте HTML:

<div>
   Name: {{ teamInfo.name }}
</div>
<div>
   <mat-table [dataSource]="List" class="mat-elevation-z8">
      <ng-container matColumnDef="ronde">
        <mat-header-cell *matHeaderCellDef matTooltip="Ronde">rd</mat-header-cell>
        <mat-cell *matCellDef="let element">{{ element.ronde }}</mat-cell>
        <mat-footer-cell *matFooterCellDef> </mat-footer-cell>
      </ng-container>
   </mat-table>
</div>

Все отлично работает для таблицы mat, потому что эти данные получены в коде Init.

В помощь коду чтобы быть понятным, я go напрямую без доступа к базе данных.

.ts файл:

export class MyComponent implements OnInit {
  teamInfo:  TeamObject;

  @Input() List: DraftList;

  constructor() {}

  ngOnInit() {
    console.log("DraftList", this.List);
    this.getConcessionInfo();
  }

  public getConcessionInfo() { 
    this.teamInfo.name ="TeamName";
    console.log(this.teamInfo.name);
  }

}

Проблема заключается в следующем: мой код работает правильно в коде .ts (Консоль В журнале есть данные, например: console.log (this.teamInfo.name);)

Но в компоненте HTML эта строка пуста: Имя: {{teamInfo.name}}

Данные, полученные в @Input, правильно печатаются в HTML. Я новичок в этом короле программирования. Может кто-то понять, почему моя переменная не печатается в HTML?

Спасибо

Answer 1

// второе решение

teamInfo = new TeamObject();

ngOnInit() {
  this.getConcessionInfo();
}

public async getConcessionInfo() {
  this.teamInfo.name = "TeamName";
  console.log(this.teamInfo.name);
}

Answer 2

Я надеюсь, что это сработает, спасибо.

  teamInfo: TeamObject;

  ngOnInit() {
    this.getConcessionInfo();
  }

  public async getConcessionInfo() {
    this.teamInfo = Object.assign(new TeamObject, this.teamInfo);
    this.teamInfo.name = "TeamName";
    console.log(this.teamInfo.name);
  }

первое решение