[CS1] Template Operators
Operators are symbols that allow you to compare two values or combine two values.
Comparison Operators
Many times you whether in using a ternary condition or in conditional rendering you'll want to use a comparison operator. This page documents what is available to you in the component studio templating language. These operators will return 1 if true or 0 if false.
| Operator | Description | Example |
| == | Equal to. Note that = is not the same thing. | {$quantity == 5} {$color == 'blue'} |
| != | Not equal to. | {$quantity != 5} {$color != 'blue'} |
| > | Greater than. | {$quantity > 2} |
| < | Less than. | {$quantity < 2} |
| >= | Greater than or equal to. | {$quantity >= 2} |
| <= | Less than or equal to. | {$quantity <= 2} |
| ? : | Ternary condition. It takes 3 arguments. The first is the condition to validate, then the true value, and then the false value. | {$level > 2 ? 1 : 0} |
Arithmetic Operators
Perform a mathematical calculation upon two values.
| Operator | Description | Example | Result |
| + | Addition | {1 + 1} | 2 |
| - | Subtraction | {1 - 1} | 0 |
| * | Multiplication | {1 * 1} | 1 |
| / | Division | {1 / 1} | 0 |
| % | Modulus, the remainder after division. | {1 % 1} {5 % 3} |
1 2 |
| min | The smaller of the two numbers. | {20 min 40} | 20 |
| max | The larger of the two numbers. | {20 max 40} | 40 |
Logical Operators
Perform logic operations on values to determine a true or false value.
| Operator | Description | Example | Result |
| ! | Not. Invalidates the value. | {!1} {! 3 < 1} |
0 1 |
| && | And. | {0 && 0} {1 && 0} {1 && 1} { 3 > 1 && 1 > 0} |
0 0 1 1 |
| || | Or. | {0 || 0} {1 || 0} {1 || 1} { 3 > 1 || 1 > 0} |
0 1 1 1 |
| // | Default. If the original is undefined, then use this. | {$something_empty // 'blue'} {$color_is_orange // 'blue'} |
blue orange |
| or | Or. Same as || | |
|
| not | Not. Same as ! | ||
| and | And. Same as && | ||
| ? : |
Ternary. It takes 3 arguments. The first is the condition to validate, then the true value, and then the false value. | {$position == 'king' ? 'purple' : 'white'} | purple |
String Operators
Use the to manipulate strings.
| Operator | Description | Example | Result |
| ~ | Concatenate. Combines two strings together. | {'R' ~ 'G' ~ 'B'} {$first_name ~ ' ' ~ $last_name} |
RGB Andy Dufresne |
| x | Repeat multiple of times. | {'A' x 3} #{$hex_byte x 3} |
AAA #FEFEFE |
Nil
When you are trying to check for a field that is undefined or empty, then you'll want to use the special keyword 'nil'. For example, if you have a field that might be empty and you don't want to render it when empty, you could add this to conditional rendering to do this:
{$this_might_be_empty == nil}
Hex Numbers
You can represent hexadecimal numbers in the template language by prefixing them with 0x (zero x). This will allow you to do math on a hex numbers for calculating colors. Example: 0xfe