Preventing polymer template-soup <p>I find myself often writing deep levels of nested templates because I can't figure out how to write fairly simple conditions in any other way. This leads to a thousand template nodes in my DOM tree and it's just a mess.</p> <p>To give an example, the following is a snippet from a custom select-box (written in Jade. "<em>template#option</em>" --> <code>&lt;template id="option"&gt;</code>, etc.)</p> <pre><code>// note that this template is user-replaceable which is why it's out here template#option span {{ label }} #dropdown template( repeat='{{ option, ix in options }}' ) template( if='{{ !option.hidden }}' ) .option( data-ix='{{ ix }}' class='{{ option.active ? "active" : "" }}' ) template( bind='{{ option }}' ref='option' ) </code></pre> <p>I'm just looking for help in cleaning this up. I feel like I <em>should</em> be able to write something like:</p> <pre><code>#dropdown .option( template repeat='{{ option, ix in options }}' if='{{ !option.hidden }}' data-ix='{{ ix }}' class='{{ option.active ? "active" : "" }}' ) template( bind='{{ option }}' ref='option' ) </code></pre> <p>But I can't seem to get anything similar to that to work.</p>