Есть ли способ использовать итерацию внутри объекта в HTML в угловых?

Question

Вот как выглядит мой HTML-код:

<div *ngFor="let historyArticle of historyArticles; let i=index">
    <div [innerHTML]='historyArticle[i].fields.text | mdToHtml'></div>
</div>

Я хочу настроить таргетинг на каждый объект в массиве historyArticle. Запись {{i}} внутри элемента div дает мне порядковый номер для каждой записи, но я хочу использовать его для указания правильного текстового поля в каждой записи

Answer 1

В этом случае вам вообще не нужен индекс i. Самой историей является статья, которую вы хотите:

<div *ngFor="let historyArticle of historyArticles">
  <div [innerHTML]='historyArticle.fields.text | mdToHtml'></div>
</div>

Answer 2

Использование *ngFor в Angular в основном циклически перебирает массив.

Таким образом:

for (let i = 0; i < this.historyArticles.length; i++) {
  // do something e.g console.log(this.historyArticles[i].fields.text);
}

Это почти то же самое, что и:

<div *ngFor="let historyArticle of historyArticles">
  <span>{{ historyArticle.fields.text }}</span>
</div>

Надеюсь, это поможет вам понять, что в этом случае вам не нужно использовать i = index

Answer 3

попробуйте это.

<div *ngFor="let historyArticle of historyArticles; let i=index">
    <div>{{historyArticle[i].fields.text | mdToHtml}}</div>
</div>