Representing a local variable with an array of text in a grid view

Hello, I have a local variable that contains an array of text retrieved from an API Call as seen below:

a!save(local!transactionList,                             
                        {
                          id: local!Transjsondata.GetTransInfo.TransInfo.Id,
                          time: local!Transjsondata.GetTransInfo.TransInfo.Time,
                          amount: local!Transjsondata.GetTransInfo.TransInfo.Amount,
                        })

so let's assume for example that i have 5 items in my transactionlist, each with their own id, time and amount, how can I represent each item accordingly in a gridview in its own row? I tried the below implementation: 

a!gridField(
            label: "List of Transactions",
            labelPosition: "ABOVE",
            data: local!transactionList,
            
            columns: {
              a!gridColumn(
                label: "Id",
                value: fv!row.id
              ),
              a!gridColumn(
                label: "Time",
                value: fv!row.time
                
              )
            },
            validations: {},
            selectable: true
          ),

However the problem is instead of having one row for each transaction, I have only one row that stores all 5 transactions and all 5 times, how can iterate or maybe use a foreach statement in order to divide them into separate rows?