如何在handlebars中按索引访问访问数组项?

时间:2021-04-19 21:21:37

I am trying to specify the index of an item in an array within a handlebars template:

我正在尝试在handlebars模板中指定数组中的项的索引:

{  people: [    {"name":"Yehuda Katz"},    {"name":"Luke"},    {"name":"Naomi"}  ]}

using this:

用这个:

<ul id="luke_should_be_here">{{people[1].name}}</ul>

If the above is not possible, how would I write a helper that could access a spefic item within the array?

如果不可能实现上述操作,那么如何编写一个助手来访问数组中的spefic项呢?

8 个解决方案

#1


346  

Try this:

试试这个:

<ul id="luke_should_be_here">{{people.1.name}}</ul>

#2


272  

The following, with an additional dot before the index, works just as expected. Here, the square brackets are optional when the index is followed by another property:

下面,在索引前面加上一个点,就像预期的那样工作。这里,当索引后面跟着另一个属性时,方括号是可选的:

{{people.[1].name}}{{people.1.name}}

However, the square brackets are required in:

但是,方括号必须是:

{{#with people.[1]}}  {{name}}{{/with}}

In the latter, using the index number without the square brackets would get one:

在后者中,使用没有方括号的索引号将得到1:

Error: Parse error on line ...:...     {{#with people.1}}                -----------------------^Expecting 'ID', got 'INTEGER'

As an aside: the brackets are (also) used for segment-literal syntax, to refer to actual identifiers (not index numbers) that would otherwise be invalid. More details in What is a valid identifier?

顺便提一句:括号(也)用于分段文字语法,用于引用实际的标识符(而不是索引号),否则这些标识符将无效。什么是有效标识符?

(Tested with Handlebars in YUI.)

(YUI使用车把进行测试。)

2.xx Update

You can now use the get helper for this:

现在可以使用get helper:

(get people index)

although if you get an error about index needing to be a string, do:

虽然如果你得到一个关于索引需要是字符串的错误,请做:

(get people (concat index ""))

#3


13  

{{#each array}}  {{@index}}{{/each}}

#4


13  

If undocumented features aren't your game, the same can be accomplished here:

如果没有文档的特性不是你的游戏,同样的事情也可以在这里完成:

Handlebars.registerHelper('index_of', function(context,ndx) {  return context[ndx];});

Then in a template

然后在一个模板

{{#index_of this 1}}{{/index_of}}   

I wrote the above before I got a hold of

在我找到之前我写了上面的

this.[0]

I can't see one getting too far with handlebars without writing your own helpers.

如果不写你自己的助手,我看不出有谁会对把手做得太过分。

#5


8  

If you want to use dynamic variables

如果你想使用动态变量

This won't work:

这不会工作:

{{#each obj[key]}}...{{/each}}

You need to do:

你需要做的:

{{#each (lookup obj key)}}...{{/each}}

see handlebars lookup helper and handlebars subexpressions.

参见handlebars查找助手和handlebars子表达式。

#6


7  

While you are looping in an array with each and if you want to access another array in the context of the current item you do it like this.

当你在一个数组中循环使用它们,如果你想在当前项的上下文中访问另一个数组,你可以这样做。

Here is the example data.

下面是示例数据。

[  {    name: 'foo',    attr: [ 'boo', 'zoo' ]  },  {    name: 'bar',    attr: [ 'far', 'zar' ]  }]

Here is the handlebars to get the first item in attr array.

这是在attr数组中获取第一项的把手。

{{#each player}}  <p> {{this.name}} </p>  {{#with this.attr}}    <p> {{this.[0]}} </p>  {{/with}}{{/each}}

This will output

这将输出

<p> foo </p><p> boo </p><p> bar </p><p> far </p>

#7


5  

Please try this, if you want to fetch first/last.

如果你想先取/后取,请试试这个。

{{#each list}}    {{#if @first}}        <div class="active">    {{else}}        <div>    {{/if}}{{/each}}{{#each list}}    {{#if @last}}        <div class="last-element">    {{else}}        <div>    {{/if}}{{/each}}

#8


0  

The following syntax can also be used if the array is not named (just the array is passed to the template):

如果数组没有命名(只是将数组传递给模板),也可以使用以下语法:

  <ul id="luke_should_be_here">  {{this.1.name}}  </ul>

#1


346  

Try this:

试试这个:

<ul id="luke_should_be_here">{{people.1.name}}</ul>

#2


272  

The following, with an additional dot before the index, works just as expected. Here, the square brackets are optional when the index is followed by another property:

下面,在索引前面加上一个点,就像预期的那样工作。这里,当索引后面跟着另一个属性时,方括号是可选的:

{{people.[1].name}}{{people.1.name}}

However, the square brackets are required in:

但是,方括号必须是:

{{#with people.[1]}}  {{name}}{{/with}}

In the latter, using the index number without the square brackets would get one:

在后者中,使用没有方括号的索引号将得到1:

Error: Parse error on line ...:...     {{#with people.1}}                -----------------------^Expecting 'ID', got 'INTEGER'

As an aside: the brackets are (also) used for segment-literal syntax, to refer to actual identifiers (not index numbers) that would otherwise be invalid. More details in What is a valid identifier?

顺便提一句:括号(也)用于分段文字语法,用于引用实际的标识符(而不是索引号),否则这些标识符将无效。什么是有效标识符?

(Tested with Handlebars in YUI.)

(YUI使用车把进行测试。)

2.xx Update

You can now use the get helper for this:

现在可以使用get helper:

(get people index)

although if you get an error about index needing to be a string, do:

虽然如果你得到一个关于索引需要是字符串的错误,请做:

(get people (concat index ""))

#3


13  

{{#each array}}  {{@index}}{{/each}}

#4


13  

If undocumented features aren't your game, the same can be accomplished here:

如果没有文档的特性不是你的游戏,同样的事情也可以在这里完成:

Handlebars.registerHelper('index_of', function(context,ndx) {  return context[ndx];});

Then in a template

然后在一个模板

{{#index_of this 1}}{{/index_of}}   

I wrote the above before I got a hold of

在我找到之前我写了上面的

this.[0]

I can't see one getting too far with handlebars without writing your own helpers.

如果不写你自己的助手,我看不出有谁会对把手做得太过分。

#5


8  

If you want to use dynamic variables

如果你想使用动态变量

This won't work:

这不会工作:

{{#each obj[key]}}...{{/each}}

You need to do:

你需要做的:

{{#each (lookup obj key)}}...{{/each}}

see handlebars lookup helper and handlebars subexpressions.

参见handlebars查找助手和handlebars子表达式。

#6


7  

While you are looping in an array with each and if you want to access another array in the context of the current item you do it like this.

当你在一个数组中循环使用它们,如果你想在当前项的上下文中访问另一个数组,你可以这样做。

Here is the example data.

下面是示例数据。

[  {    name: 'foo',    attr: [ 'boo', 'zoo' ]  },  {    name: 'bar',    attr: [ 'far', 'zar' ]  }]

Here is the handlebars to get the first item in attr array.

这是在attr数组中获取第一项的把手。

{{#each player}}  <p> {{this.name}} </p>  {{#with this.attr}}    <p> {{this.[0]}} </p>  {{/with}}{{/each}}

This will output

这将输出

<p> foo </p><p> boo </p><p> bar </p><p> far </p>

#7


5  

Please try this, if you want to fetch first/last.

如果你想先取/后取,请试试这个。

{{#each list}}    {{#if @first}}        <div class="active">    {{else}}        <div>    {{/if}}{{/each}}{{#each list}}    {{#if @last}}        <div class="last-element">    {{else}}        <div>    {{/if}}{{/each}}

#8


0  

The following syntax can also be used if the array is not named (just the array is passed to the template):

如果数组没有命名(只是将数组传递给模板),也可以使用以下语法:

  <ul id="luke_should_be_here">  {{this.1.name}}  </ul>