Looping in Underscore Template

Question

My JSON object looks like this:

{
    "datas": [
        [
            {
                "time": "08:00",
                "frequency": "daily"
            },
            {
                "time": "14:00",
                "frequency": "daily"
            },
            {
                "time": "20:00",
                "frequency": "daily"
            }
        ]
    ]
}

My underscore html looks like so:

<ul class="table-view">
    <% _.each(datas, function(schedule, key) { %>
    <li class="table-view-cell">
        <a href="#enter-reading/<%= key %>" 
           class="push-right"><%= schedule.time %></a>
    </li>
    <% }); %>
</ul>

Here is the entire html that is printed on render:

<ul class="table-view">
    <li class="table-view-cell">
        <a href="#enter-reading/0" class="push-right"></a>
    </li>
</ul>

What am I doing wrong?

Answer 1

Your datas is array with only one element - array with models. You have to update your template replacing datas with datas[0], or store it in var and pass it into loop

<ul class="table-view">
    <% _.each(datas[0], function(schedule, key) { %>
    <li class="table-view-cell">
        <a href="#enter-reading/<%= key %>" 
           class="push-right"><%= schedule.time %></a>
    </li>
    <% }); %>
</ul>