на каждом шаге используйте итерацию ngFor по индексу

Question

У меня есть массив объектов, и я запускаю ngFor на этом. Я хочу показать разные представления для каждой итерации ngFor.

const HEROES = [
    {id: 1, name:'Superman'},
    {id: 2, name:'Batman'},
    {id: 5, name:'BatGirl'},
    {id: 3, name:'Robin'},
    {id: 4, name:'Flash'}
];

Как Superman должно быть видом по умолчанию, тогда, когда я нажимаю «Далее», должно отображаться Batman, следующим будет BatGirl и так далее.

Есть идеи?

Answer 1

Вы можете использовать одну переменную, содержащую выбранный в данный момент объект.

в html

`

<div>
    <span>{{selectedObj.name}}</span>
</div>

`

Ins файл изначально , вы можете иметь

selectedObj = {};

count = 0;

this.selectedObj = HEROS [count];

каждый раз, когда вы нажмите на следующую кнопку

next ()

{

this.count ++;

this.selectedObj = HEROS[count];

}