diff --git a/README.md b/README.md index 80c2895..b25f428 100644 --- a/README.md +++ b/README.md @@ -9,7 +9,7 @@ * Name-spaced variables: `{{=User.address.city}}` * If/else blocks: `{{value}} <> {{:value}} <> {{/value}}` * If not blocks: `{{!value}} <> {{/!value}}` - * Object/Array iteration: `{{@object_value}} {{=_key}}:{{=_val}} {{/@object_value}}` + * Object/Array iteration (see **Nested Loops** below): `{{@object_value}} {{=_key}}:{{=_val}} {{/@object_value}}` * Multi-line templates (no removal of newlines required to render) * Render the same template multiple times with different data * Works in all modern browsers @@ -21,6 +21,33 @@ For more advanced usage check the [`t_test.html`](https://github.com/jasonmoo/t.js/blob/master/t_test.html). +### Nested Loops + +When looping over the `_val` variable of a deeply nested loop of loops like: + +``` +{{@_val}} 1 + {{@_val}} 2 + {{/@_val}} 3 +{{/@_val}} 4 +``` + +the parser cannot match the opening `@_val` with its corresponding `/@_val` picking the first end tag it finds, +that is, it matches `1` with `3` instead of `4`. + +To tell them apart, the start and end tags can be followed by a space and a label: + +``` +{{@_val outer}} + {{@_val inner}} + {{/@_val inner}} +{{/@_val outer}} +``` + +See this [Github issue](https://github.com/jasonmoo/t.js/issues/21) for more details. + +--- + This software is released under the MIT license. ___ diff --git a/t.js b/t.js index add6913..ac50244 100644 --- a/t.js +++ b/t.js @@ -18,7 +18,7 @@ */ (function() { - var blockregex = /\{\{(([@!]?)(.+?))\}\}(([\s\S]+?)(\{\{:\1\}\}([\s\S]+?))?)\{\{\/\1\}\}/g, + var blockregex = /\{\{(([@!]?)([\.\w]+)[\s\S]*?)\}\}(([\s\S]+?)(\{\{:\1\}\}([\s\S]+?))?)\{\{\/\1\}\}/g, valregex = /\{\{([=%])(.+?)\}\}/g; function t(template) { diff --git a/t.min.js b/t.min.js index 4152667..ac273eb 100644 --- a/t.min.js +++ b/t.min.js @@ -1,2 +1 @@ -(function(){function c(a){this.t=a}function l(a,b){for(var e=b.split(".");e.length;){if(!(e[0]in a))return!1;a=a[e.shift()]}return a}function d(a,b){return a.replace(h,function(e,a,i,f,c,h,k,m){var f=l(b,f),j="",g;if(!f)return"!"==i?d(c,b):k?d(m,b):"";if(!i)return d(h,b);if("@"==i){e=b._key;a=b._val;for(g in f)f.hasOwnProperty(g)&&(b._key=g,b._val=f[g],j+=d(c,b));b._key=e;b._val=a;return j}}).replace(k,function(a,c,d){return(a=l(b,d))||0===a?"%"==c?(new Option(a)).innerHTML.replace(/"/g,"""): -a:""})}var h=/\{\{(([@!]?)(.+?))\}\}(([\s\S]+?)(\{\{:\1\}\}([\s\S]+?))?)\{\{\/\1\}\}/g,k=/\{\{([=%])(.+?)\}\}/g;c.prototype.render=function(a){return d(this.t,a)};window.t=c})(); \ No newline at end of file +!function(){var n=/\{\{(([@!]?)([\.\w]+)[\s\S]*?)\}\}(([\s\S]+?)(\{\{:\1\}\}([\s\S]+?))?)\{\{\/\1\}\}/g,r=/\{\{([=%])(.+?)\}\}/g;function t(n){this.t=n}function e(n,r){for(var t=r.split(".");t.length;){if(!(t[0]in n))return!1;n=n[t.shift()]}return n}function i(t,u){return t.replace(n,(function(n,r,t,o,f,a,c,l){var p,s=e(u,o),v="";if(!s)return"!"==t?i(f,u):c?i(l,u):"";if(!t)return i(a,u);if("@"==t){for(p in n=u._key,r=u._val,s)s.hasOwnProperty(p)&&(u._key=p,u._val=s[p],v+=i(f,u));return u._key=n,u._val=r,v}})).replace(r,(function(n,r,t){var i=e(u,t);return i||0===i?"%"==r?function(n){return new Option(n).innerHTML.replace(/"/g,""")}(i):i:""}))}t.prototype.render=function(n){return i(this.t,n)},window.t=t}(); \ No newline at end of file diff --git a/t_test.html b/t_test.html index f410c54..36f41ba 100644 --- a/t_test.html +++ b/t_test.html @@ -15,7 +15,7 @@ - +