Как получить доступ к последнему элементу в массиве Handlebars.js?

Question

Учитывая следующую структуру данных:

{
    "name" : "test",
    "assetType" : "Home",
    "value" : [ 
        {
            "value" : "999",
            "date" : "10/03/2018"
        }, 
        {
            "value" : "1234.56",
            "date" : "10/04/2018"
        }
    ]
}

Как я могу напрямую получить доступ к первому и последнему элементу value в руле? Мой код:

<td>{{value.[0].value}}</td>
<td>{{value.[value.length - 1].value}}</td>

Первое утверждение работает нормально, но я не могу понять, как получить доступ к последнему элементу. value.length внутри []s не возвращает никакого значения, но рендеринг value.length вне массива работает нормально.

Я пытался с помощью @first а также @last в массиве, но те, кажется, тоже не работают.

Answer 1

Как уже указывалось, вы можете легко решить эту проблему с помощью помощника шаблона:

Template.myTemplate.helpers({
  first (arr) {
    return arr && arr[0]
  },
  last (arr) {
    return arr && arr[arr.length - 1]
  },
  atIndex (arr, index) {
    return arr && index >= 0 && index <= arr.length - 1 && arr[index]
  }
})

Затем вы можете создать контекст, используя #with где контекстный объект является результатом работы помощников. В этом контексте вы можете получить доступ к свойствам, используя this,

Доступ к значениям с именем value будет выглядеть следующим образом:

<td>{{#with first value}}{{this.value}}{{/with}}</td>
<td>{{#with last value}}{{this.value}}{{/with}}</td>
<td>{{#with atIndex value 5}}{{this.value}}{{/with}}</td>