When developing website templates in AnQi CMS, we often need to understand the specific structure of a variable on the page and what data it contains, so that we can accurately call its properties.Being able to quickly view the complete structure and value of variables, especially when facing complex business logic or unfamiliar template variables, is undoubtedly a key to improving development efficiency.The AnQi CMS provides us with concise and powerful variable debugging methods based on the syntax features of the Django template engine.

core tools:dumpFilter

Anqi CMS template provides a nameddumpThe powerful filter, which can directly output the complete structure, data type, and current value of variables in the template, helping us to get a clear picture of the variables at a glance. When you encounter an uncertain variable in a template file and want to know what fields it contains internally, or what the actual value of a field is, dumpThe filter can be used.

It is very simple to use, you just need to add it after the variable you want to view|dump. For example, if you want to view the core document variable of the current pagearchiveThe detailed information, you can temporarily add a line of code in the template like this:

{# 临时添加，用于调试，查看 archive 变量的完整结构和值 #}
<pre>{{ archive | dump }}</pre>

Some explanations:Here we usually use<pre>Wrapped by tag{{ ... | dump }}because it outputsdumpThe filter will return a formatted text, using<pre>Tags can retain their original line breaks and spaces, making the output results clearer and more readable.

When you save the template file and refresh the page, you will see detailed output similar to the structure of Go language, which includesarchiveAll field names, data types, and their current values of the variable. For example:

&models.Archive{Id:101, Title:"安企CMS模板调试指南", SeoTitle:"", Link:"/article/101.html", Keywords:"模板调试,变量查看", Description:"本文将详细介绍如何在安企CMS模板中调试查看变量的完整结构和值。", Content:"...", ModuleId:1, CategoryId:5, CanonicalUrl:"", UserId:1, ParentId:0, Price:0.00, Stock:1, ReadLevel:0, OriginUrl:"", Views:120, Flag:"h", CreatedTime:1678886400, UpdatedTime:1678886400, Status:1, Sort:10, Tags:[], Category:models.Category{Id:5, Title:"开发教程", ...}}

Through this output, you can clearly seearchiveA variable is amodels.Archivestructured type of and can understand itsId/Title/Link/Viewsand its associatedCategoryAll properties and their corresponding values.

A more accurate view:stringformatFilter is related to%#v

AlthoughdumpThe filter is very practical, but in some cases, you may need a more closely aligned original output with the backend Go language struct definition, or you may want to control the output format more precisely.stringformatFilter combined with Go's formatting verbs%#vWould be another good choice.

%#vFormatting verbs can output the Go language syntax representation of values, including type names and field names, which can provide a clearer structural view for developers familiar with Go.

You can use it like this:

{# 临时添加，用于调试，查看 item 变量的 Go 语言语法表示 #}
<pre>{{ item | stringformat:"%#v" }}</pre>

For example, in onearchiveListofforloop, you want to view eachitemvariable's detailed structure:

{% archiveList archives with type="list" limit="3" %}
    {% for item in archives %}
        <h3>{{ item.Title }}</h3>
        {# 查看当前循环中的 item 变量的 Go 语法表示 #}
        <pre>{{ item | stringformat:"%#v" }}</pre>
    {% endfor %}
{% endarchiveList %}

After refreshing the page, you will see eachitemThe variable is output in the form of a Go struct code snippet, which is very helpful for understanding the backend data model and variable types.

Debugging Practice: Step-by-step variable inspection

Mastereddumpandstringformat:"%#v"After these tools, the actual debugging process will become very intuitive:

  1. Determine the target variable:Firstly, make it clear which variable you want to view. It may be a page-level variable (such asarchive/category） may also be an element in a loop（such asfor item in archivesofitem），or a nested attribute of some variable（such asitem.Category).
  2. Insert debug code:in a template file（usually intemplatethe directory..htmlIn the file），find the position where you want to view the variable, and temporarily insert{{ 你的变量 | dump }}or{{ 你的变量 | stringformat:"%#v" }}If you are debugging in a loop, make sure to place the code inside the loop so you can view the specific value of each element.
  3. Save and refresh the page:Save the modified template file, then refresh the corresponding page in the browser.
  4. Analysis output:View the structure and values of variables output on the page. According to the output, you can confirm if the variables exist, what fields they contain, the data types of the fields, and their current values.
  5. Adjust as needed:According to the analysis results, adjust your template code and correctly call the properties of the variables.
  6. Remove debug code: An extremely important step!Ensure that all debugging code is removed from the template after debugging is completed.Debug code should not be retained in the final production environment, as it may expose sensitive information, affect page performance, or even lead to security issues.

If you edit the template directly in the background, this process will be more convenient, with modifications and viewing effects almost synchronized in real-time.

Precautions

  • Temporary operations:Debug code is temporary, please remember to delete or comment it out immediately after debugging.
  • Page layout impact:Inserting debugging output into the template may temporarily disrupt the original layout and style of the page, which is normal during the debugging process.
  • Sensitive information: dumpandstringformatIt will output the entire content of the variable. If the variable contains sensitive information such as user passwords, database connection strings, etc., please debug in a secure environment and ensure that the debugging code will not be leaked to the outside.

By using flexibilitydumpandstringformatFilter, the debugging work of the AnQi CMS template will be unprecedentedly efficient and transparent.No matter how complex the data structure you face, these two tools can help you quickly locate problems and build a stable and feature-complete website.

【en】###