Почему данные API не отображаются на лицевой стороне в Angular? ⇐ Html

[Гость]

Я создаю полнофункциональное приложение в Angular и SpringBoot. Я уже много раз занимался подобными проектами, но у меня есть простая проблема, которую я не могу решить.

Вот файл .ts:

import { Component, OnInit } из '@angular/core'; импортировать {ChestService} из '../chest.service'; импортировать {Сундук} из '../chest.model'; импортировать {lastValueFrom} из 'rxjs'; @Компонент({ селектор: 'app-сундук', templateUrl: './chest.comComponent.html', styleUrls: ['./chest.comComponent.scss'] }) класс экспорта ChestComponent реализует OnInit { сундуки: Сундук[] = []; конструктор (частный сундукService: ChestService) { } асинхронный ngOnInit() { дождитесь этого.getAllChests(); console.log(this.chests) } асинхронный getAllChests() { const data = await LastValueFrom(this.chestService.getAllChests()); this.chests = данные; } } Вот файл .html:

Мои сундуки {{ сундук.имя }}

и модель:

класс экспорта Сундук { идентификационный номер; имя ?: строка; описание ?: строка; Дата создания ?: строка; имя пользователя ?: строка; пароль ?: строка; ссылка ?: строка; конструктор(id ?: номер, имя ?: строка, описание ?: строка, createDate ?: строка, имя пользователя ?: строка, пароль ?: строка, ссылка ?: строка) { this.id = идентификатор; это.имя = имя; это.описание = описание; это.Дата создания = Дата создания; this.username = имя пользователя; this.password = пароль; this.link = ссылка; } } Когда я просматриваю вкладку сети в браузере, я замечаю, что объекты передаются из API. В файле .ts console.log(this.chests) отображает объекты в консоли. Но файл ;html отображает только тег, и я не понимаю, почему он не отображает имя каждого объекта.

Кто-нибудь знает, в чем проблема?