In the process of website template development, you often encounter the need to extract the first element or character from a data collection (whether it is an array, slice, or string).AnQiCMS uses a syntax similar to Django's template engine, providing rich tags (Tags) and filters (Filters), allowing us to handle data flexibly and efficiently.

This article will introduce in detail how to easily obtain the first element/character of an array or string using these powerful tools in AnQiCMS templates.

First, usefirstFilter: Directly get the first element or character

AnQiCMS provides a very intuitive and concisefirstFilter, specifically used to get the first element/character of an array, slice, or string.When you know that the data is an iterable collection or a string and you only need its first part, this is the most recommended method.

firstThe filter automatically identifies the type of the input data:

  • For arrays or slicesIt will return the first element in the array.
  • For a stringIt will return the first character of the string. It is worth mentioning that AnQiCMS'sfirstThe filter can correctly handle Chinese characters and will return the first character.

Usage:

You only need to pass the variable to be processed through the pipe character.|connected tofirstthe filter.

{# 假设我们有一个字符串变量 #}
{% set myString = "AnQiCMS 内容管理系统" %}
<p>字符串的第一个字符是：{{ myString | first }}</p>

{# 假设我们有一个数组或切片变量 #}
{% set myArray = ["苹果", "香蕉", "橘子", "梨"] %}
<p>数组的第一个元素是：{{ myArray | first }}</p>

{# 也可以直接应用于标签返回的数组 #}
{% tagList tags with limit="3" %}
<p>Tag 列表的第一个 Tag 名称是：{{ tags | first | attr:"Title" }}</p>
{% endtagList %}

Output example:

字符串的第一个字符是：A
数组的第一个元素是：苹果
Tag 列表的第一个 Tag 名称是：AnQiCMS

Caution:If the input isfirstThe data of the filter is empty (nil), an empty string, or an empty array, it will not return any content. Therefore, you can combineiftags to judge before using, to ensure that the data exists.

Second, usesliceFilter: Slice specified elements or characters by index

sliceThe filter provides more flexible truncation capabilities.Although it is mainly used to obtain a subsequence of a dataset, it can also be ingeniously used to obtain the first element.slicefilters are very applicable.

Get the first element/character:

Passslice:":1"The form of the value, you can extract a subsequence from the starting position to the first element (excluding the second element).It is important to note that this method still returns a new array or string (containing one element), rather than the first element itself directly.firstFurther processing of the filter.

Usage:

{# 假设我们有一个字符串变量 #}
{% set myString = "AnQiCMS 模板制作" %}
<p>截取字符串的第一个字符（返回一个包含单字符的字符串）：'{{ myString | slice:":1" }}'</p>
<p>直接获取截取字符串的第一个字符：{{ (myString | slice:":1") | first }}</p>

{# 假设我们有一个数组或切片变量 #}
{% set myArray = ["前端", "后端", "设计", "运维"] %}
<p>截取数组的第一个元素（返回一个包含单元素的数组）：{{ myArray | slice:":1" }}</p>
<p>直接获取截取数组的第一个元素：{{ (myArray | slice:":1") | first }}</p>

{# 获取前三个字符或元素 #}
<p>字符串的前三个字符是：'{{ myString | slice:":3" }}'</p>
<p>数组的前三个元素是：{{ myArray | slice:":3" | join:", " }}</p>

Output example:

截取字符串的第一个字符（返回一个包含单字符的字符串）：'A'
直接获取截取字符串的第一个字符：A
截取数组的第一个元素（返回一个包含单元素的数组）：[前端]
直接获取截取数组的第一个元素：前端
字符串的前三个字符是：'AnQ'
数组的前三个元素是：前端, 后端, 设计

sliceParameter format of the filter:

  • :Indicates starting from the beginning or ending at the end.
  • start:Represents fromstart