Appearance
Template Functions
Template functions allow you to use pre-built logic built into App Maker to complete certain tasks that you wouldn't normally be able to do by just templating data.
A good example of this is linked and child issues in Jira. The full content of these issues is not available in the issue context, so you can't just template them in like you would with other fields.
Instead, you can use a template function to tell App Maker to go and fetch the full content of these related issues and then display them in your app.
Basic Usage
You might be familiar with the concept of a "function" from other tools, but if not, that's fine. Functions have two main parts:
- They have a name, used when you want to use (or "call") the function.
- To "call" a function, you use the double curly braces like when you are using a template.
- Then immediately inside the opening braces, write the name of the function you want to "call", followed by a colon. e.g.
myFunction:
- And they have one or more pieces of data that you want the function to use when it runs. Providing this data to the function is called "passing" it to the function.
- You often then need to "pass" some data to the function for it to use. The pieces of data you pass are called "arguments".
- You "pass" the "arguments" to the function by simply adding them inside the template braces after "calling" the function, making sure there is a single-space between the colon and the argument you want to pass. e.g.
myFunction: someData
- If a function needs more than one piece of data to be passed to it, you can separate each piece of data with a space. e.g.
myFunction: someData someOtherData
Example
- The example below shows an example that uses a template function called
childIssues:
- This function allows you to fetch the full details of all the issues that are the "children" of the issue that the App is being displayed in.
- It works by taking the "parent" issue as the data you pass to the function, and returns a list of all the child issues under that issue.
- An example of when you would want to use this is if you wanted to display a table of all the child issues of the issue the user is currently viewing.
json
{
"resourceType": "site",
"module": "jira:issueContext",
"title": "my-first-app",
"action": "set",
"componentData": {
"type": "DynamicTable",
"columnHeaders": ["...columnHeaders"],
"tableRows": "{{childIssues: jiraIssue}}"
}
}
Note:
- You might notice that
jiraIssue
is also the first part of a template path that you would use to template the data of the issue. - The
childIssues:
function actually takes any object that has a property calledkey
that the function can use to fetch the child issues of that object. - It doesn't necessarily need a full Jira Issue object, as long as the object passed has a
key
property and the value of that property matches a Jira issue in your Jira site.- It could be as simple as an object like
{key: "ISSUE-123"}
.
- It could be as simple as an object like
Outcome
- The outcome of this function would be a list of all the child issues of the issue that the App is being displayed in.
json
{
"resourceType": "site",
"module": "jira:issueContext",
"title": "my-first-app",
"action": "set",
"componentData": {
"type": "DynamicTable",
"columnHeaders": ["...columnHeaders"],
"tableRows": [{
"key": "ISSUE-123",
"fields": {
"summary": "Child Issue 1 Summary",
"status": "Open"
}
},
{
"key": "ISSUE-456",
"fields": {
"summary": "Child Issue 2 Summary",
"status": "In Progress"
}
}]
}
}
List Function
- One of the most important Template Functions is the
list:
function, used to convert a Data List into a list of objects that can be used inside a Dynamic Table.- We already used this in a previous guide when you were learning how Data Lists work.
- The
list:
function takes a Data List as an argument and returns that list formatted so that it can be rendered in a Dynamic Table.
Example List Function Usage
- Assume you have a Data List with two records in it like below.
Example Data List
json
[
{
"id": 12345,
"title": "Big deal with important customer",
"owner": "John Doe",
"status": "Open",
"link": "https://google.com"
},
{
"id": 54321,
"title": "Small deal with unimportant customer",
"owner": "Jane Doe",
"status": "Closed",
"link": "https://google.com"
}
]
- To use this Data List in a Dynamic Table, you would use the
list:
function to parse the Data List into the format needed by the Dynamic Table Component like below.
Example List Function Usage
json
{
"type": "DynamicTable",
"columnHeaders": [],
"tableRows": "{{list: dataLists.site.crm-deals}}"
}
- Once executed, the
list:
function will convert the template into a fully populated list of objects that can be rendered in a Dynamic Table like below.
Example Output
json
{
"type": "DynamicTable",
"columnHeaders": [],
"tableRows": [
{
"id": 12345,
"title": "Big deal with important customer",
"owner": "John Doe",
"status": "Open",
"link": "https://google.com"
},
{
"id": 54321,
"title": "Small deal with unimportant customer",
"owner": "Jane Doe",
"status": "Closed",
"link": "https://google.com"
}
]
}
Available Functions
For a full list of available functions, see the Template Functions reference.