首页 > 解决方案 > 如何访问 Handlebars.js 数组中的最终元素?

问题描述

给定以下数据结构:

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

如何直接访问valueHandlebars 中的第一个和最后一个元素?我的代码是:

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

第一条语句工作正常,但我不知道如何访问最后一个元素。value.length's内部[]不返回任何值,但value.length在数组外部渲染工作正常。

我尝试在数组中使用@first@last,但这些似乎也不起作用。

标签: meteorhandlebars.jsspacebars

解决方案


正如已经指出的,您可以使用模板助手轻松解决此问题:

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>

推荐阅读