In repeat.for, как индексировать первый элемент в массиве

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

это мой html

<div repeat.for = "item of items">
            <div class = "row">
                <div class = "center">
                    <div>
                        <md-label > ${item.name}</md-label><br /><br />
                        <md-label> ${user.firstName},</md-label><br />
                         <md-label> ${item.Description}</md-label><br />
                        
                    </div>
                </div>

            </div>
            <div class = "row">
                
                <div class = "col">

                    <md-radio name = "myOption" value = "0" checked.bind = "choice">Never</md-radio><br />
                
                </div>
                <div><a click.delegate = "next()">next</a></div>
            </div>
        </div>

async onLoad() {
        this.items= await this.query<ItemQuery, ItemModel>(new ItemQuery({ id: this.id }));
        this.user= await this.query<fetchUser, UserModel>(new fetchUser(this.UserId));
        
        
    }
async next(){}

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

пример моего массива

this.items=[{name:"Test1",description:"this is test 1"}]
[{name:"Test2",description:"this is test 2"}]
[{name:"Test3",description:"this is test 3"}]

я не уверен, как загрузить в первый экземпляр только значения для Test1, а затем, когда будет нажат следующий, получить детали Test2, используя приведенный выше HTML?

🤔 А знаете ли вы, что...
JavaScript можно использовать для создания ботов и автоматизации задач в браузерах с помощью Puppeteer.