Support bracket name to specify array index in Mustache

When beginner users write Mustache in template node, they tend to encounter problems to specify array index. For example:

The current template node supports only dot name (e.g. payload.array.0) and doesn't support bracket name (e.g. payload.array[0]). Therefore, they especially have problems when they use variable paths copied from debug tab.

Example flow

Example flow data

[{"id":"c6f6377add70d8fb","type":"inject","z":"43fab81c88fde8bf","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"array\":[\"a\",\"b\",\"c\"]}","payloadType":"json","x":150,"y":100,"wires":[["2034d76315d03923","d2097a4024a1b6ed"]]},{"id":"2034d76315d03923","type":"debug","z":"43fab81c88fde8bf","name":"output array","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":370,"y":100,"wires":[]},{"id":"d2097a4024a1b6ed","type":"template","z":"43fab81c88fde8bf","name":"","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"This is the payload: {{payload.array[0]}} !","output":"str","x":200,"y":180,"wires":[["0e4939f974791cf9"]]},{"id":"0e4939f974791cf9","type":"debug","z":"43fab81c88fde8bf","name":"output 1st character in array","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":420,"y":180,"wires":[]}]

Because the Mustache engine will not handle the bracket name, I hope that Node-RED supports both the dot and bracket style by replacement implementation.

I agree it isn't ideal, but it isn't as simple as just adding support for bracket syntax.

If we were to add bracket syntax then we can no longer say it is mustache syntax - we wouldn't be able to use the standard mustache library and we have to maintain the whole parser ourselves. I'm not sure we can justify the cost of doing that.

An alternative approach would be to see if there is a mustache-compatible library out there that already has the support for bracket syntax. I'm not aware of any. Handlebars.js is largely mustache compatible, but doesn't do the bracket syntax you are looking for.

Hi Nick, I've been thinking about this for some time & this post along with another recent post about copying the path for the function node has sparked a thought...

What if the copy button right click presented a context menu with the choice of...

  • Copy Path (e.g. payload[0].name)
  • Copy Full Path (e.g. msg.payload[0].name)
  • Copy Mustache Path (e.g. payload.0.name)

The left click can remain the same.

That way we support the current 3 options (and any future options can simply be added)

I'm not sure. My instinct is that more options = more decisions a user has to make.

Adding 'copy mustache path' is going to be very niche and only relevant to a tiny selection of nodes - plus adds the burden for a user to wonder what 'mustache' means in this context.

i'm very much more options = more choice :wink: - but I understand your concern and that was partly the reason I said on right click (leaving left click alone). In a sense, it would be something that had to be discovered, looked for or told about - but those of us who do know the difference it is a bonus.

The way I view this is, we have to keep telling users if they copy for a function, add msg., if you copy an array element path for mustache, change to the .x. format - or - we tell them to right click the copy path button.

Better of the two evils IMO.

Thank you for your discussions. I agree that the bracket style is not the Mustache format. Instead of replacement handling, I prefer to use right-click button (or left-click with the ctrl key) to copy the path in dot style. I can avoid manual replacement like the following case.

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