Template filters in Flask - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is a template filter in Flask?

A template filter in Flask is a function that modifies or formats data before displaying it in a template. It helps change how data looks without changing the data itself.

beginner

How do you apply a built-in filter in a Flask template?

You apply a filter by using the pipe symbol (|) after a variable in the template. For example, {{ name|upper }} changes the text in 'name' to uppercase.

intermediate

How can you create a custom template filter in Flask?

You create a custom filter by defining a Python function and then registering it with Flask using the @app.template_filter decorator or app.add_template_filter().

intermediate

What is the purpose of using template filters instead of modifying data in the view?

Template filters keep the view code clean and separate data formatting from logic. This makes templates easier to read and maintain.

beginner

Example: What does {{ 3.14159|round(2) }} output in a Flask template?

It outputs 3.14 by rounding the number 3.14159 to 2 decimal places using the built-in 'round' filter.

Which symbol is used to apply a filter to a variable in a Flask template?

A |

B &

C #

D %

The pipe symbol (|) is used to apply filters in Flask templates, like {{ variable|filter }}.

How do you register a custom filter in Flask?

A Using @app.template_filter decorator

B Using @app.route decorator

C Using @app.before_request decorator

D Using @app.errorhandler decorator

Custom filters are registered with @app.template_filter or app.add_template_filter().

What does the built-in 'upper' filter do in Flask templates?

A Converts text to lowercase

B Reverses the text

C Converts text to uppercase

D Removes spaces from text

The 'upper' filter changes all letters in a string to uppercase.

Why use template filters instead of formatting data in the Flask view?

A Filters slow down the app

B Filters change the original data permanently

C Filters are harder to maintain

D Filters keep templates and views separate and clean

Filters help keep formatting in templates, making views simpler and code cleaner.

Which of these is NOT a built-in Flask template filter?

A capitalize

B pluralize

C lower

D round

'pluralize' is not a built-in filter in Flask; you would need to create a custom filter for that.

Explain how to create and use a custom template filter in Flask.

Think about how you connect Python code to templates.

Describe why template filters are useful in Flask templates.

Consider the difference between data and how it looks.

Practice

1. What does the | upper filter do in a Flask template?

easy

A. Truncates the text to a specified length

B. Rounds a number to the nearest integer

C. Formats a date to a readable string

D. Converts the text to uppercase letters

Solution

1. Step 1: Understand the purpose of the upper filter

   The upper filter changes all letters in a string to uppercase.

2. Step 2: Compare with other filters

   Other filters like round, truncate, and date formatting do different tasks unrelated to letter case.

3. Final Answer:

   Converts the text to uppercase letters -> Option D

4. Quick Check:

   upper = uppercase text [OK]

Hint: Remember: upper means all caps text [OK]

Common Mistakes:

• Confusing upper with round or truncate
• Thinking upper formats dates
• Using upper on numbers expecting rounding

2. Which of the following is the correct syntax to apply the round filter to a variable price in a Flask template?

easy

A. {{ price | round(2) }}

B. {{ round(price, 2) }}

C. {{ price.round(2) }}

D. {{ price | round:2 }}

Solution

1. Step 1: Recall Flask template filter syntax

   Filters are applied using the pipe symbol | followed by the filter name and optional arguments in parentheses.

2. Step 2: Identify the correct syntax for round

   The correct syntax is {{ price | round(2) }}. Other options either misuse method call syntax or wrong separator.

3. Final Answer:

   {{ price | round(2) }} -> Option A

4. Quick Check:

   Filter syntax uses pipe and parentheses [OK]

Hint: Use pipe (|) then filter name with parentheses [OK]

Common Mistakes:

• Using dot notation like a method call
• Using colon instead of parentheses for arguments
• Calling Python functions directly inside templates

3. Given this Flask template snippet:

{{ 'hello world' | truncate(8) }}

What will be the output rendered on the webpage?

medium

A. hello w

B. hello wo...

C. hello worl

D. hello world

Solution

1. Step 1: Understand the truncate filter behavior

   The truncate(8) filter shortens the string to 8 characters including the ellipsis ....

2. Step 2: Calculate the truncated output

   It keeps 5 characters from the original string and adds ... to make total length 8: "hello wo" + "..." = "hello wo...".

3. Final Answer:

   hello wo... -> Option B

4. Quick Check:

   truncate(8) = 5 chars + ... [OK]

Hint: truncate(n) includes ... in total length n [OK]

Common Mistakes:

• Ignoring the ellipsis length
• Assuming truncate cuts exactly n characters
• Confusing truncate with slice or substring

4. What is wrong with this Flask template code?

{{ username | upper() }}

It causes an error when rendering. Why?

medium

A. The variable username must be a number for upper

B. The upper filter does not exist in Flask

C. Filters should not have parentheses when no arguments are passed

D. The pipe symbol | is missing

Solution

1. Step 1: Check filter usage syntax

   Filters without arguments should be used without parentheses, like {{ username | upper }}.

2. Step 2: Identify the cause of error

   Using parentheses without arguments causes a syntax error in Flask templates.

3. Final Answer:

   Filters should not have parentheses when no arguments are passed -> Option C

4. Quick Check:

   No parentheses for no-arg filters [OK]

Hint: No parentheses for filters without arguments [OK]

Common Mistakes:

• Adding empty parentheses to filters
• Thinking all filters require parentheses
• Confusing filters with Python function calls

5. You want to display a date variable post_date in your Flask template as "April 05, 2024". Which filter usage is correct to achieve this format?

hard

A. {{ post_date | date('%B %d, %Y') }}

B. {{ post_date | format_date('MMMM dd, yyyy') }}

C. {{ post_date | datetime('%B %d, %Y') }}

D. {{ post_date | strftime('%B %d, %Y') }}

Solution

1. Step 1: Identify the correct Flask template filter for date formatting

   The date filter formats dates using Python's strftime format codes.

2. Step 2: Match the format string to desired output

   The format '%B %d, %Y' produces "April 05, 2024". Other options use incorrect filter names or format styles.

3. Final Answer:

   {{ post_date | date('%B %d, %Y') }} -> Option A

4. Quick Check:

   Date filter + strftime format = {{ post_date | date('%B %d, %Y') }} [OK]

Hint: Use date filter with Python strftime format [OK]

Common Mistakes:

• Using non-existent filters like format_date
• Confusing JavaScript date formats with Python
• Using strftime filter which Flask does not provide