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

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

1. UsefirstFilter: Directly retrieve the first element or character

AnQiCMS provides a very intuitive and concisefirstA filter that is used specifically 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 the first part, this is the most recommended method.

firstThe filter automatically identifies the type of input data:

  • For arrays or slicesIt will return the first element of the array.
  • For 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 Chinese character.

Usage:

You just need to pass the variable you want to process through the pipe symbol|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

Note:If passedfirstThe filter's data is empty (nilPunctuation, empty string, or empty array, it will not return any content. Therefore, it can be combined with the tagifto determine if the data exists.

Second, usesliceFilter: Extract specified elements or characters by index

sliceThe filter provides more flexible slicing capabilities. Although it is mainly used to obtain a subsequence of a data set, it can also be ingeniously used to get the first element.When you need to get the first element included in the 'first N elements' as a new set, or when you need to precisely control the range in a specific scenario,slicea filter is very applicable.

Get the first element/character:

Byslice:":1"The form, you can extract the substring from the start position to the first element (excluding the second one).It should be noted that this method returns a new array or string (containing one element) rather than the first element itself.If you need to retrieve the first element of this new collection, you can combinefirstFurther 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:Indicates fromstart