squirrellyjs / squirrelly

Semi-embedded JS template engine that supports helpers, filters, partials, and template inheritance. 4KB minzipped, written in TypeScript ⛺
https://squirrelly.js.org
MIT License
592 stars 82 forks source link

VM661:3 Uncaught ReferenceError: hvals is not defined #126

Closed 7iomka closed 4 years ago

7iomka commented 4 years ago

UPD: https://codepen.io/7iomka/pen/rNBbygN?editors=1010

I'm new with your plugin, and I don't know how to do my code working.. Help me please...

I temporary use handlebars to do same to work https://codepen.io/7iomka/pen/pozBerx?editors=1010

nebrelbug commented 4 years ago

Hi @7iomka, looks like you actually spotted a bug! Let me take a look at this and see if I can deploy a quick fix.

7iomka commented 4 years ago

Hi @7iomka, looks like you actually spotted a bug! Let me take a look at this and see if I can deploy a quick fix.

sorry for changed content in provided link, because I temporary use handlebars, because I don't found a solution for this error. I updated the link for demo with problem.

donpedro commented 4 years ago

Perhaps just a workaround, but see forked pen where the one change is on HTML line 2: {{each(@items)}} to {{each(options.items)}}

Should we expect {{each(@items)}} to work? If so, why? Actually, according the docs, I would expect {{each(items)}} to work, but it does not-- I get Uncaught ReferenceError: items is not defined.

So my question is: what is the magic behind referring to the incoming object context as "options", as is done often in the documentation?

nebrelbug commented 4 years ago

Hi @donpedro, thanks for the response! Your change:

{{each(@items)}} to {{each(options.items)}}

is correct! Unfortunately, there's one more problem (the bug) - the if helper doesn't have helper variables, but Squirrelly still increases the scope at which it looks for the helper refs. So if you compare your pen (which is syntactically correct) to @7iomka's pen with Handlebars, the descriptions for each item are missing.

Hopefully I'll push a fix soon :)

So my question is: what is the magic behind referring to the incoming object context as "options", as is done often in the documentation?

Great question! The simple answer is that the data you pass in to Sqrl.Render or Sqrl.Compile should be referenced by putting an options. in front of it, similarly to how with doT.js you have to prefix everything with an it. It just simplifies parsing, though I'll probably remove this inconvenience in some future release.

Best of luck! I'll get to work on a fix right now :)

nebrelbug commented 4 years ago

@7iomka @donpedro It turns out there actually isn't a bug! I've been puzzling for a while trying to figure out where the bug is, but it turns out that the template has @this.type === "1" instead of @this.type === 1. Here's a link to my working CodePen with the necessary changes :)

It's good to know that Squirrelly was actually working well, and it was actually just a simple bug!

Let me know if this helps!

@donpedro thanks for putting me on to checking the syntax!

nebrelbug commented 4 years ago

@donpedro @7iomka is it alright if I add you both to the README as contributors?

donpedro commented 4 years ago

@nebrelbug sure!

nebrelbug commented 4 years ago

Great! @all-contributors please add @donpedro for answering questions

allcontributors[bot] commented 4 years ago

@nebrelbug

I've put up a pull request to add @donpedro! :tada:

nebrelbug commented 4 years ago

@donpedro thanks for your involvement! You're now listed as a contributor on the README.

Hope you contribute more to Squirrelly in the future!