Проблемы:
- Как получить доступ к массиву
includes
, чтобы получить URL-адрес изображения для его отображения? (или как получить изображения для рендеринга в целом) - Почему мои
description
поля не отображаются?
Итак, у меня есть содержательный сервис, который получает все записи как таковой:
//get all exhibits
getExhibits(query?: object): Promise<Entry<any>[]> {
return this.cdaClient.getEntries(Object.assign({
include : 2,
content_type: CONFIG.contentTypeIds.exhibit
}, query))
.then(res => res.items);
}
Вышеупомянутая функция вызывается в моем компоненте галереи следующим образом:
ngOnInit() {
this.contentfulService.getExhibits()
.then(exhibits => this.exhibits = exhibits);
}
И данные отображаются в соответствующем HTML как таковом:
<section class="gallery__section" [class.menu--open]="menu.isMenuClosed" *ngFor="let exhibit of exhibits">
<figure>
<img src="{{ exhibit.fields.file.url }}" alt="">
<!-- HOW DO I GET THE IMG URL -->
</figure>
<div class="gallery__text">
<h2 class="gallery__heading">Gallery</h2>
<p class="gallery__title">{{ exhibit.fields.title }}</p>
<h3 class="gallery__artist">{{ exhibit.fields.artist }}</h3>
<p class="gallery_onview">On View</p>
<p class="gallery__dates">{{ exhibit.fields.date }}</p>
<p class="gallery__description" *ngIf="exhibit.fields.description.content[0].content[0].value">{{ exhibit.fields.description.content[0].content[0].value }}</p>
</div>
</section>
Ниже - JSON одного item
массива items
:

А здесь изображение, которое должно быть частью вышеуказанного item
, но помещено в другой массив, называемый includes
:

Ниже представлена console.log
продукция одного экспоната:
