helpers /  Collections

Special Helpers Categories

Collections

{{last}}

Returns the last item in a collection. Opposite of first.
Parameters: none

Data:

"collection": [
  "Amy Wong",
  "Bender",
  "Dr. Zoidberg",
  "Fry",
  "Hermes Conrad",
  "Leela",
  "Professor Farnsworth",
  "Scruffy"
]

Template:

{{last collection}}

Renders to:

Scruffy

{{after}}

Returns all of the items in the collection after the specified count.
Parameters: count int - How many items to omit from the beginning. (Required)

Data:

"collection": [
  "Amy Wong",
  "Bender",
  "Dr. Zoidberg",
  "Fry",
  "Hermes Conrad",
  "Leela",
  "Professor Farnsworth",
  "Scruffy"
]

Template:

{{after collection 5}}

Renders to:

Leela, Professor Farnsworth, Scruffy

{{before}}

Returns all of the items in the collection before the specified count. Opposite of after.
Parameters: count int - How many items to omit from the end. (Required)

Data:

"collection": [
  "Amy Wong",
  "Bender",
  "Dr. Zoidberg",
  "Fry",
  "Hermes Conrad",
  "Leela",
  "Professor Farnsworth",
  "Scruffy"
]

Template:

{{before collection 5}}

Renders to:

Amy Wong, Bender, Dr. Zoidberg

{{eachIndex}}

Current implementation of the default Handlebars loop helper {{#each}} adding index (0-based index) to the loop context.
Parameters: none

Data:

"collection": ["Professor Farnsworth", "Fry", "Bend"]

Template:

{{#eachIndex collection}}
  {{this}} is {{index}}
{{/eachIndex}}

Renders to:

Professor Farnsworth is 0, Fry is 1, Bender is 2

{{eachProperty}}

Uses the key and value of each property in an object to render a block.
Parameters: none

Data:

"collection": {
  "one": 1,
  "two": 2
}

Template:

{{#eachProperty object}}
    {{key}} - {{value}}<br/>
{{/eachProperty }}

Renders to:

one - 1
two - 2

{{empty}}

Conditionally render a block if the collection is empty.
Parameters: none

Data:

"collection": []

Template:

{{#empty collection}}
    Good news everyone!
{{else}}
    Bad news everyone!
{{/empty}}

Renders to:

Good news everyone!

{{first}}

Returns the first item in a collection.
Parameters: none

Data:

"collection": [
  "Amy Wong",
  "Bender",
  "Dr. Zoidberg",
  "Fry",
  "Hermes Conrad",
  "Leela",
  "Professor Farnsworth",
  "Scruffy"
]

Template:

{{first collection}}

Renders to:

Amy Wong

{{inArray}}

Conditionally render a block if a specified value is in the collection.
Parameters: value string|int - A value to test against. (Required)

Data:

"collection": ["Professor Farnsworth", "Fry", "Bend"]

Template:

{{#inArray collection "Fry"}}
  I'm walking on sunshine!
{{else}}
  I'm walking on darkness.
{{/inArray}}

Renders to:

I'm walking on sunshine!

{{join}}

Joins all elements of a collection into a string using a separator if specified.
Parameters: separator string - A string to use as a separator between the items. (Optional)

Data:

"collection": [
  "Amy Wong",
  "Bender",
  "Dr. Zoidberg",
  "Fry",
  "Hermes Conrad",
  "Leela",
  "Professor Farnsworth",
  "Scruffy"
]

Template:

{{join collection " & "}}

Renders to:

Amy Wong & Bender & Dr. Zoidberg & Fry & Hermes Conrad & Leela & Professor Farnsworth & Scruffy

{{any}}

Conditionally render a block if the collection isn't empty. Opposite of empty
Parameters: none

Data:

"collection": ["Professor Farnswor"]

Templates:

{{#any collection}}
  Good news everyone!
{{else}}
  Bad news everyone!
{{/any}}

Renders to:

Good news everyone!

{{length}}

Returns the length of the collection.
Parameters: none

Data:

"collection": [
  "Amy Wong",
  "Bender",
  "Dr. Zoidberg",
  "Fry",
  "Hermes Conrad",
  "Leela",
  "Professor Farnsworth",
  "Scruffy"
]

Template:

{{length collection}}

Renders to:

8

{{lengthEqual}}

Conditionally render a block based on the length of a collection.
Parameters: length int - The value to test against. (Required)

Data:

"collection": [
  {
    "name": "Leela",
    "deliveries": 8021
  },
  {
    "name": "Bender",
    "deliveries": 239
  },
  {
    "name": "Fry",
    "deliveries": -12
  }
]

Template:

{{#lengthEqual collection 3}}
  There are 3 people in Planet Express.
{{else}}
  This is not Planet Express.
{{/lengthEqual}}

Renders to:

There are 3 people in Planet Express.

{{sort}}

Returns the collection sorted. Parameters: none

Data:

"collection": [
  "Amy Wong",
  "Bender",
  "Dr. Zoidberg",
  "Fry",
  "Hermes Conrad",
  "Leela",
  "Professor Farnsworth",
  "Scruffy"
]

Template:

{{sort collection}}

Renders to:

Amy Wong, Bender, Dr. Zoidberg, Fry, Hermes Conrad, Leela, Professor Farnsworth, Scruffy

{{withAfter}}

Use all of the items in the collection after the specified count inside a block.
Parameters: count int - How many items to omit from the beginning. (Required)

Data:

"collection": [
  "Amy Wong",
  "Bender",
  "Dr. Zoidberg",
  "Fry",
  "Hermes Conrad",
  "Leela",
  "Professor Farnsworth",
  "Scruffy"
]

Template:

{{#withAfter collection 5}}
    {{titleize this}}
{{/withAfter}}

Renders to:

Leela Professor Farnsworth Scruffy

{{withBefore}}

Use all of the items in the collection before the specified count inside a block. Opposite of withAfter.
Parameters: count int - How many items to omit from the end. (Required)

Data:

"collection": [
  "Amy Wong",
  "Bender",
  "Dr. Zoidberg",
  "Fry",
  "Hermes Conrad",
  "Leela",
  "Professor Farnsworth",
  "Scruffy"
]

Template:

{{#withBefore collection 5}}
    {{reverse this}}
{{/withBefore}}

Renders to:

gnoW ymA redneB grebdioZ .rD

{{withFirst}}

Use the first item in a collection inside a block.
Parameters: none

Data:

"collection": [
  "Amy Wong",
  "Bender",
  "Dr. Zoidberg",
  "Fry",
  "Hermes Conrad",
  "Leela",
  "Professor Farnsworth",
  "Scruffy"
]

Template:

{{#withFirst collection}}
  <p>{{this}} is smart.</p>
{{/withFirst}}

Renders to:

<p>Amy Wong is smart.</p>

{{withLast}}

Use the last item in a collection inside a block. Opposite of withFirst.
Parameters: none

Data:

"collection": [
  "Amy Wong",
  "Bender",
  "Dr. Zoidberg",
  "Fry",
  "Hermes Conrad",
  "Leela",
  "Professor Farnsworth",
  "Scruffy"
]

Template:

{{#withLast collection}}
  <p>{{this}} is lazy.</p>
{{/withLast}}

Renders to:

<p>Scruffy is lazy.</p>

{{withSort}}

Uses the sorted collection inside the block.
Parameters: field string - String name of the field or property to sort by. (Optional)

Data:

"collection": [
  {
    "name": "Leela",
    "deliveries": 8021
  },
  {
    "name": "Bender",
    "deliveries": 239
  },
  {
    "name": "Fry",
    "deliveries": -12
  }
]

Template:

{{#withSort collection "deliveries"}}
  {{name}}: {{deliveries}} <br>
{{/withSort}}

Renders to:

Fry: -12
Bender: 239
Leela: 8021

Also, if you have the sortable variable inside another variable, you can use dot-notation (e.g. {{deliveries.value}}) to sort.

Data:

{
  "collection": [
    {
      "name": "Leela",
      "deliveries": {"value": 8021, "priority": "high" }
    },
    {
      "name": "Bender",
      "deliveries": {"value": 239, "priority": "normal" }
    },
    {
      "name": "Fry",
      "deliveries": {"value": -12, "priority": "low" }
    }
  ]
}

Template:

{{#withSort collection "deliveries.value"}}
  {{name}}: {{deliveries.value}} <br>
{{/withSort}}

Renders to:

Fry: -12
Bender: 239
Leela: 8021

See the template for this page →

Find an error? Let us know →