I actually used template strings as templateing in two of my projects. You can take aa look here:
https://github.com/mohsen1/json-schema-view-js/blob/master/src/index.js#L59-L175 Two main problems I had with this was: * There is no `if` condition in template strings. I had to **hack** my way by yet another template string function that returns empty string if the condition is falsy: https://github.com/mohsen1/json-schema-view-js/blob/master/src/helpers.js#L9-L21 * The falsy stuff are not rendered as you expect (empty string): ```js let o = undefined; console.log(`${o}`); // => 'undefined' ``` On Sun, Sep 13, 2015 at 6:04 PM <[email protected]> wrote: > Send es-discuss mailing list submissions to > [email protected] > > To subscribe or unsubscribe via the World Wide Web, visit > https://mail.mozilla.org/listinfo/es-discuss > or, via email, send a message with subject or body 'help' to > [email protected] > > You can reach the person managing the list at > [email protected] > > When replying, please edit your Subject line so it is more specific > than "Re: Contents of es-discuss digest..." > Today's Topics: > > 1. Re: Template strings as a template language. (Thomas) > 2. Re: Template strings as a template language. (Bob Myers) > 3. Re: Template strings as a template language. (Mark S. Miller) > 4. Re: Template strings as a template language. (Isiah Meadows) > 5. RE: Template strings as a template language. (Ron Buckton) > > > > ---------- Forwarded message ---------- > From: Thomas <[email protected]> > To: Alexander Jones <[email protected]> > Cc: "Mark S. Miller" <[email protected]>, es-discuss < > [email protected]> > Date: Mon, 14 Sep 2015 01:47:37 +1000 > Subject: Re: Template strings as a template language. > > > > On 14 Sep 2015, at 1:38 AM, Alexander Jones <[email protected]> wrote: > > > > Not exactly sure what you mean. But if you are you asking how > > > > ```js > > let template = 'this ${foo} and that ${bar}'; > > // later... > > let output = String.evalTemplate(template, {foo: "thing", bar: "other > thing"}); > > ``` > > is different to > > > > ```js > > let template = ({foo, bar}) => `this ${foo} and that ${bar}`; > > // later... > > let output = template({foo: "thing", bar: "other thing"}); > > ``` > > > > then I have a couple of answers off the top of my head: > > * The value of `template` is a simple string and thus can be trivially > loaded from JSON or a file in the former case, but not the latter. Getting > the latter involves some kind of eval anyway. > > Exactly - being able to not touch modules for something like this is > important. > > > * The number of occurrences of each template parameter (e.g. `"foo"`) > is limited to once at the definition site, and once at the invocation site, > instead of twice at definition. `with` seems like a non-starter. > > Minimising definitions is worth doing. Although, the good thing about > arguments is that it's possible to specify default values... > > > > ---------- Forwarded message ---------- > From: Bob Myers <[email protected]> > To: [email protected] > Cc: > Date: Sun, 13 Sep 2015 21:28:04 +0530 > Subject: Re: Template strings as a template language. > Templating languages typically "compile" templates into functions through > various lexical transformations. > > Consider a template file foo.tem: > > ``` > My name is ${this.name}. > ``` > > Lexically transform this into > > ``` > function foo() { > return `My name is ${this.name|}.`; > } > > Then invoke the template as eg > > ``` > foo.call({name: 'Bob'}) > ``` > > Having said that, I doubt if ES6 template strings serve as a useful basis > for a full-fledged templating system. To take just one basic example, how > would one implement the equivalent of `{{#if}}`? > > Bob > > > > > ---------- Forwarded message ---------- > From: "Mark S. Miller" <[email protected]> > To: Bob Myers <[email protected]> > Cc: es-discuss <[email protected]> > Date: Sun, 13 Sep 2015 16:09:31 -0700 > Subject: Re: Template strings as a template language. > > > On Sun, Sep 13, 2015 at 8:58 AM, Bob Myers <[email protected]> wrote: > >> Templating languages typically "compile" templates into functions through >> various lexical transformations. >> >> Consider a template file foo.tem: >> >> ``` >> My name is ${this.name}. >> ``` >> >> Lexically transform this into >> >> ``` >> function foo() { >> return `My name is ${this.name|}.`; >> } >> >> Then invoke the template as eg >> >> ``` >> foo.call({name: 'Bob'}) >> ``` >> >> Having said that, I doubt if ES6 template strings serve as a useful basis >> for a full-fledged templating system. To take just one basic example, how >> would one implement the equivalent of `{{#if}}`? >> > > What does `{{#if}}` mean? > > >> >> Bob >> >> >> _______________________________________________ >> es-discuss mailing list >> [email protected] >> https://mail.mozilla.org/listinfo/es-discuss >> >> > > > -- > Cheers, > --MarkM > > > > ---------- Forwarded message ---------- > From: Isiah Meadows <[email protected]> > To: "Mark S. Miller" <[email protected]> > Cc: Bob Myers <[email protected]>, es-discuss <[email protected]> > Date: Sun, 13 Sep 2015 19:14:53 -0400 > Subject: Re: Template strings as a template language. > On Sun, Sep 13, 2015 at 7:09 PM, Mark S. Miller <[email protected]> > wrote: > > > > > > On Sun, Sep 13, 2015 at 8:58 AM, Bob Myers <[email protected]> wrote: > >> > >> Templating languages typically "compile" templates into functions > through > >> various lexical transformations. > >> > >> Consider a template file foo.tem: > >> > >> ``` > >> My name is ${this.name}. > >> ``` > >> > >> Lexically transform this into > >> > >> ``` > >> function foo() { > >> return `My name is ${this.name|}.`; > >> } > >> > >> Then invoke the template as eg > >> > >> ``` > >> foo.call({name: 'Bob'}) > >> ``` > >> > >> Having said that, I doubt if ES6 template strings serve as a useful > basis > >> for a full-fledged templating system. To take just one basic example, > how > >> would one implement the equivalent of `{{#if}}`? > > > > > > What does `{{#if}}` mean? > > > > An example from Handlebars' website (which is likely where he drew the > syntax from): > > ``` > {{permalink}} > {{#each comments}} > {{../permalink}} > > {{#if title}} > {{../permalink}} > {{/if}} > {{/each}} > ``` > > > > >> > >> > >> Bob > >> > >> > >> _______________________________________________ > >> es-discuss mailing list > >> [email protected] > >> https://mail.mozilla.org/listinfo/es-discuss > >> > > > > > > > > -- > > Cheers, > > --MarkM > > > > _______________________________________________ > > es-discuss mailing list > > [email protected] > > https://mail.mozilla.org/listinfo/es-discuss > > > > > > -- > Isiah Meadows > > > > > ---------- Forwarded message ---------- > From: Ron Buckton <[email protected]> > To: Isiah Meadows <[email protected]>, "Mark S. Miller" < > [email protected]> > Cc: Bob Myers <[email protected]>, es-discuss <[email protected]> > Date: Mon, 14 Sep 2015 01:04:03 +0000 > Subject: RE: Template strings as a template language. > This is theoretically possible: > > ``` > let t = $template` > ${$item.permalink} > ${$each($item.comments)` > ${$parent.permalink} > ${$if($item.title)` > ${$parent.permalink} > `} > `} > `; > let s = t(data); > ``` > > ...given an adequate implementation using proxies (to create bindings for > e.g. `$item.permalink` for later evaluation) and tagged template functions. > Whether or not this would make for a reasonable implementation is left to > the reader. > > Ron > ------------------------------ > From: Isiah Meadows <[email protected]> > Sent: 9/13/2015 4:15 PM > To: Mark S. Miller <[email protected]> > Cc: Bob Myers <[email protected]>; es-discuss <[email protected]> > Subject: Re: Template strings as a template language. > > On Sun, Sep 13, 2015 at 7:09 PM, Mark S. Miller <[email protected]> > wrote: > > > > > > On Sun, Sep 13, 2015 at 8:58 AM, Bob Myers <[email protected]> wrote: > >> > >> Templating languages typically "compile" templates into functions > through > >> various lexical transformations. > >> > >> Consider a template file foo.tem: > >> > >> ``` > >> My name is ${ > https://na01.safelinks.protection.outlook.com/?url=this.name&data=01%7c01%7cron.buckton%40microsoft.com%7ce705066eae3849ee21f008d2bc913033%7c72f988bf86f141af91ab2d7cd011db47%7c1&sdata=CY6YpX1n5jLScYGX2W1tIi2ndGlA7WI8ZTJUZjDL2Gw%3d > }. > >> ``` > >> > >> Lexically transform this into > >> > >> ``` > >> function foo() { > >> return `My name is ${this.name|}.`; > >> } > >> > >> Then invoke the template as eg > >> > >> ``` > >> foo.call({name: 'Bob'}) > >> ``` > >> > >> Having said that, I doubt if ES6 template strings serve as a useful > basis > >> for a full-fledged templating system. To take just one basic example, > how > >> would one implement the equivalent of `{{#if}}`? > > > > > > What does `{{#if}}` mean? > > > > An example from Handlebars' website (which is likely where he drew the > syntax from): > > ``` > {{permalink}} > {{#each comments}} > {{../permalink}} > > {{#if title}} > {{../permalink}} > {{/if}} > {{/each}} > ``` > > > > >> > >> > >> Bob > >> > >> > >> _______________________________________________ > >> es-discuss mailing list > >> [email protected] > >> > https://na01.safelinks.protection.outlook.com/?url=https%3a%2f%2fmail.mozilla.org%2flistinfo%2fes-discuss&data=01%7c01%7cron.buckton%40microsoft.com%7ce705066eae3849ee21f008d2bc913033%7c72f988bf86f141af91ab2d7cd011db47%7c1&sdata=Vk9C%2fonHktgLCsW%2f395PrpBWefRcs6XFqJk7HTVbunE%3d > >> > > > > > > > > -- > > Cheers, > > --MarkM > > > > _______________________________________________ > > es-discuss mailing list > > [email protected] > > > https://na01.safelinks.protection.outlook.com/?url=https%3a%2f%2fmail.mozilla.org%2flistinfo%2fes-discuss&data=01%7c01%7cron.buckton%40microsoft.com%7ce705066eae3849ee21f008d2bc913033%7c72f988bf86f141af91ab2d7cd011db47%7c1&sdata=Vk9C%2fonHktgLCsW%2f395PrpBWefRcs6XFqJk7HTVbunE%3d > > > > > > -- > Isiah Meadows > _______________________________________________ > es-discuss mailing list > [email protected] > > https://na01.safelinks.protection.outlook.com/?url=https%3a%2f%2fmail.mozilla.org%2flistinfo%2fes-discuss&data=01%7c01%7cron.buckton%40microsoft.com%7ce705066eae3849ee21f008d2bc913033%7c72f988bf86f141af91ab2d7cd011db47%7c1&sdata=Vk9C%2fonHktgLCsW%2f395PrpBWefRcs6XFqJk7HTVbunE%3d > _______________________________________________ > es-discuss mailing list > [email protected] > https://mail.mozilla.org/listinfo/es-discuss >
_______________________________________________ es-discuss mailing list [email protected] https://mail.mozilla.org/listinfo/es-discuss
