Silverstripe - how to render arrays in templates using ArrayList and ArrayData

Rendering indexed arrays

Let’s say we have an array called '$colors'. To render this on your template you’ll need to push the array contents into an ArrayList and wrap its contents with ArrayData like so

public function Colors() {
    $colors = ['red', 'green', 'blue'];
    $colorsList = new ArrayList();
            
    foreach ($colors as $color) {
        $colorsList->push(
            new ArrayData([
                'Color' => $color
            ])
        );
    }

    return $colorsList;
}

Now you can render the '$colors' array onto your template by calling the method 'Colors()' in a loop like this

<% loop $Colors %>
    <span>$Color</span>
<% end_loop %>

Rendering multi-dimensional arrays

Assuming we have a two-dimensional array called '$books', we'll need to push each item in the array into an ArrayList like so

public function Books() {
    $books = [
        [
            'Title' => 'Book one',
            'Author' => 'John Doe',
            'Price' => 25
        ],
        [
            'Title' => 'Book two',
            'Author' => 'Mary Jane',
            'Price' => 50
        ]
    ];
    $booksList = new ArrayList();

    foreach ($books as $book) {
        $booksList->push($book);
    }

    return $booksList;
}

Since '$books' is already a two-dimensional array we don’t need to wrap its contents with ArrayData like we did in the first example. This is because ArrayList is already a wrapper for arrays or arrays of objects.

We can now render the '$books' array onto our template by calling the 'Books()' function in a loop like this

<% loop $Books %>
    <p>Title: $Title</p>
    <p>Author: $Author</p>
    <p>Price: $Price</p>
<% end_loop %>