Persistent Syntax Error in HTML Node with {{#each}} Helper (Generate HTML Template)...Newbie out of option for errors

n8n version: 1.69.2 (cloud):
Running n8n via iMac Desktop.
Operating system: MacOS Sequoia 15.2 M4 16Gb
Workflow:
Webhook → OpenAI Assistant → Code 1 → Code 2 → Set → HTML

Subject: Persistent Syntax Error in HTML Node with {{#each}} Helper (Generate HTML Template)

Hi everyone,

I’m encountering a persistent “invalid syntax” error in the HTML node of my n8n workflow, specifically when using the {{#each}} helper within the “Generate HTML Template” operation. I’ve been troubleshooting this extensively and would appreciate any insights or suggestions.

My Workflow:

The workflow is relatively simple:

  1. Code Node: [ Briefly describe what your Code node does - e.g., fetches data from an API, manipulates data, etc. ]
  2. Edit Fields Node: This node takes the output from the Code node and structures it into a JSON object.
  • Mode: JSON
  • JSON Configuration:
{
  "patientName": "{{ $json[0].patientName }}",
  "providerName": "{{ $json[0].providerName }}",
  "dateOfEncounter": "{{ $json[0].dateOfEncounter }}",
  "narrativeSummary": "{{ $json[0].narrativeSummary }}",
  "impression": {{ $json[0].impression }},
  "plan": {{ $json[0].plan }},
  "problemAnalysis": "{{ $json[0].problemAnalysis }}",
  "dataReview": "{{ $json[0].dataReview }}",
  "riskAssessment": "{{ $json[0].riskAssessment }}",
  "clinicalJustification": "{{ $json[0].clinicalJustification }}",
  "managementPathway": "{{ $json[0].managementPathway }}"
}
  • Input JSON to Edit Fields:
[
  {
    "patientName": "** Mr. John Hinkle \n**Health Provider Name:** Dr. Amy Smith \n**Date of Encounter:** December 10, 2024",
    "providerName": "** Dr. Amy Smith \n**Date of Encounter:** December 10, 2024",
    "dateOfEncounter": "** December 10, 2024",
    "narrativeSummary": "During the yearly follow-up for Mr. John Hinkle's ongoing treatment of sleep apnea, there were positive findings regarding his compliance with the prescribed CPAP therapy and its efficiency in managing his symptoms. He demonstrates a strong understanding of his treatment regimen and maintains his equipment appropriately. His current BMI is 34, indicating a need for weight management. His follow-up is scheduled for the next year.",
    "impression": [
      "Diagnosis: Sleep Apnea, Severe."
    ],
    "plan": [
      "1. Continue using the CPAP machine at current settings."
    ],
    "problemAnalysis": "",
    "dataReview": "",
    "riskAssessment": "",
    "clinicalJustification": "",
    "managementPathway": ""
  }
]
  • Output JSON of Edit Fields (which is the Input to the HTML Node):
[
  {
    "patientName": "** Mr. John Hinkle \n**Health Provider Name:** Dr. Amy Smith \n**Date of Encounter:** December 10, 2024",
    "providerName": "** Dr. Amy Smith \n**Date of Encounter:** December 10, 2024",
    "dateOfEncounter": "** December 10, 2024",
    "narrativeSummary": "During the yearly follow-up for Mr. John Hinkle's ongoing treatment of sleep apnea, there were positive findings regarding his compliance with the prescribed CPAP therapy and its efficiency in managing his symptoms. He demonstrates a strong understanding of his treatment regimen and maintains his equipment appropriately. His current BMI is 34, indicating a need for weight management. His follow-up is scheduled for the next year.",
    "impression": [
      "Diagnosis: Sleep Apnea, Severe."
    ],
    "plan": [
      "1. Continue using the CPAP machine at current settings."
    ],
    "problemAnalysis": "",
    "dataReview": "",
    "riskAssessment": "",
    "clinicalJustification": "",
    "managementPathway": ""
  }
]
  1. HTML Node: This node is configured to generate an HTML report from the JSON data.
  • Operation: Generate HTML Template
  • HTML Template:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Medical Report</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
        }
        h1, h2 {
            color: #333;
        }
        ul {
            list-style-type: none;
            padding-left: 0;
        }
    </style>
</head>
<body>
    <h1>Medical Report</h1>
    <h2>Patient Information</h2>
    <p><strong>Patient Name:</strong> {{ $json.patientName }}</p>
    <p><strong>Provider Name:</strong> {{ $json.providerName }}</p>
    <p><strong>Date of Encounter:</strong> {{ $json.dateOfEncounter }}</p>

    <h2>Narrative Summary</h2>
    <p>{{ $json.narrativeSummary }}</p>

    <h2>Impression</h2>
    <ul>
        {{#each impression}}
        <li>{{ this }}</li>
        {{/each}}
    </ul>

    <h2>Plan</h2>
    <ul>
        {{#each plan}}
        <li>{{ this }}</li>
        {{/each}}
    </ul>

    <h2>Problem Analysis</h2>
    <p>{{ $json.problemAnalysis }}</p>

    <h2>Data Review</h2>
    <p>{{ $json.dataReview }}</p>

    <h2>Risk Assessment</h2>
    <p>{{ $json.riskAssessment }}</p>

    <h2>Clinical Justification</h2>
    <p>{{ $json.clinicalJustification }}</p>

    <h2>Management Pathway</h2>
    <p>{{ $json.managementPathway }}</p>
</body>
</html>

Expected Output:

A well-formatted HTML document displaying the patient’s medical information.

Actual Output (Error):

Error: invalid syntax at Expression.renderExpression (/usr/local/lib/node_modules/n8n/node_modules/n8n-workflow/dist/Expression.js:234:23) at Expression.resolveSimpleParameterValue (/usr/local/lib/node_modules/n8n/node_modules/n8n-workflow/dist/Expression.js:207:34) at Object.evaluateExpression (/usr/local/lib/node_modules/n8n/node_modules/n8n-core/dist/NodeExecuteFunctions.js:2270:44) at Object.execute (/usr/local/lib/node_modules/n8n/node_modules/n8n-nodes-base/dist/nodes/Html/Html.node.js:444:62) at Workflow.runNode (/usr/local/lib/node_modules/n8n/node_modules/n8n-workflow/dist/Workflow.js:722:42) at /usr/local/lib/node_modules/n8n/node_modules/n8n-core/dist/WorkflowExecute.js:706:66 at /usr/local/lib/node_modules/n8n/node_modules/n8n-core/dist/WorkflowExecute.js:1137:20

Troubleshooting Steps Taken:

  • Verified that the input to the HTML node is valid JSON.
  • Confirmed that the “Operation” in the HTML node is set to “Generate HTML Template”.
  • Tested with a simplified HTML template to isolate the issue.
  • Experimented with various Handlebars syntax for accessing data, including $json.propertyName, $json[0].propertyName, and accessing properties directly within the {{#each}} loop.
  • Added conditional checks ({{#if}}) around the {{#each}} loops.
  • Used a Set node to inspect the data being passed to the HTML node.
  • Confirmed that, in “Generate HTML Template” mode, $json refers to the first item of the input array.

n8n Version:

1.69.2 (Cloud)

The Issue:

The error consistently occurs when the HTML node attempts to render the {{#each impression}} and {{#each plan}} loops. It seems like there might be a specific issue with how the HTML node in this version is handling the {{#each}} helper within the “Generate HTML Template” operation.

Has anyone encountered a similar issue or have any suggestions for resolving this syntax error?

Thank you for your time and assistance!

It looks like your topic is missing some important information. Could you provide the following if applicable.

  • n8n version:
  • Database (default: SQLite):
  • n8n EXECUTIONS_PROCESS setting (default: own, main):
  • Running n8n via (Docker, npm, n8n cloud, desktop app):
  • Operating system:

(I have no idea how to “copy” my workflow code. I’m very sorry, but aside from giving you my written workflow, I do not understand how the entire code of the workflow is copied.)
WCT

Hi @Doc

Thanks for posting here and welcome to the community! :raised_hands:
You can share your workflow as JSON by pasting it between two ``` blocks.

First off, where are you getting the idea of this {{ #each }} helper from?
If you want to loop you can use the n8n expressions syntax to refer to the input item.

If you can share your workflow with some pinned data, I will be able to help more :slight_smile:

Tip for sharing your workflow in the forum

Pasting your n8n workflow


Ensure to copy your n8n workflow and paste it in the code block, that is in between the pairs of triple backticks, which also could be achieved by clicking </> (preformatted text) in the editor and pasting in your workflow.

```
<your workflow>
```

Make sure that you’ve removed any sensitive information from your workflow and include dummy data or pinned data as much as you can!


Hey, Ria–
Thx for the tips; I’ll do my best to see if I can better help myself by reading the Expressions literature.

To your point, the “idea” to use the coding technique came from either the Chat-GPT 4.0 model, or one of the LLM in the Chatbot Arena (that I’ve pressed into serving my interests). I simply have to try to have their input, as I don’t understand a tiny bit of the coding languages. So, to paraphrase, I understand so very little about what I’m doing, I really don’t understand your query. (Sorry, about that.)

When I say that I’m a “no-code newbie”…I mean it quite literally. The last time I looked at coding was when BASIC was being introduced. I think in systems and schematics, having some background from engineering in my past, but as a physician, I really enjoy the challenge of trying to build my own dictation to note system…I just may not be in a position to allow n8n to help me…and, I agree, it’s pretty awesome.

Thank you & the n8n team for making this tech a reality. The problem here is all on my end of the table.

Just to remind you–you guys are awesome!!
Thx, again-
Doc

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.