In this blog I will share how to use for loop with liquid templates.
- Introduction
- When to use?
- For loop
Introduction
Liquid is a template language created by Shopify. It's available as an open source project on GitHub, and is used by many different software projects and companies.
more information can be found here.
When to use?
Liquid templates are great tool to bind your UI with XML or json response, additionally you can use these in your Azure Integration services such as logic apps or Azure API management.
recently I have used the liquid template with various scenarios.
documentation to learn liquid templates can be found here.
https://shopify.github.io/liquid/basics/introduction/
For loop
Let's learn how to write loops using Liquid template in various conditions.
Loop all Item of an Array
[
"apple",
"mango"
"banana"
]
"fruits" :[
{% for item in content %}
{
"name": "{{item}}"
}
{% if forloop.last == false %},{% endif %}
{% endfor %}
Loop over all items in a collection backwards
[
"apple",
"mango"
"banana"
]
Here we can use reversed keyword to revers the Item of an array.
"fruits" :[
{% for item in content reversed %}
{
"name": "{{item}}"
}
{% if forloop.last == false %},{% endif %}
{% endfor %}
Loop over a sorted collection
[
"apple",
"mango"
"banana"
]
Here we can use sort keyword with pipe character (|) to sort the element of an array.
"fruits" :[
{% for item in (content | sort) %}
{
"name": "{{item}}"
}
{% if forloop.last == false %},{% endif %}
{% endfor %}
Loop a certain number of times
{% for i in (0..4) %}
Iteration {{ i }}
{% endfor %}
Loop a variable number of times
{$ assign start = 0 %}
{% assign end = 4 %}
{% for i in (start..end) %}
Iteration {{ i }}
{% endfor %}
**
Loop a certain number of times backwards**
{% for i in (0..4) reversed %}
Iteration {{ i }}
{% endfor %}
Loop over an arbitrary range of integers
{% for i in (-3..3) %}
Iteration {{ i }}
{% endfor %}
Loop over the first 5 items in a collection
[
"apple",
"mango"
"banana",
"Avocados",
"Cherry",
"Blueberries"
]
Here we can use limit keyword to limit the Item of an array.
"fruits" :[
{% for item in content | limit: 5 %}
{
"name": "{{item}}"
}
{% if forloop.last == false %},{% endif %}
{% endfor %}
Loop over the first 5 items in a collection in reverse order
[
"apple",
"mango"
"banana",
"Avocados",
"Cherry",
"Blueberries"
]
Here we can use reversed keyword to revers the Item of an array.
{% assign rev_content = content | reverse %}
"fruits" :[
{% for item in rev_content | limit: 5 %}
{
"name": "{{item}}"
}
{% if forloop.last == false %},{% endif %}
{% endfor %}
Do something special on the Nth iteration of the loop
[
"Sunday",
"Monday"
"Tuesday",
"Wednesday",
"Thursday",
"Friday",
"Saturday"
]
Here we can use reversed keyword to revers the Item of an array.
{% for d in content %}
{{ forloop.index }}
{% if forloop.first %}st
{% elsif forloop.index == 2 %}nd
{% elsif forloop.index == 3 %}rd
{% else %}th{% endif %}
day is {{ d }}
{% endfor %}
That's it I hope you will find this useful.
Thanks!! 🍻🍻🍻🍻.
Top comments (0)