StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>An <code>ng-switch</code> (<a href="http://docs.angularjs.org/api/ng.directive%3angSwitch" rel="nofollow">docs</a>) can help you out here; something like this:</p> <pre class="lang-html prettyprint-override"><code><div ng-repeat="item in items"> <div ng-switch on="item.type"> <div ng-switch-when="int"> <input type="range" max="{{item.max}}" min="{{item.min}}" ng-model="item.value" /> </div> <div ng-switch-when="text"> <textarea ng-model="item.value"></textarea> </div> </div> </div> </code></pre> <p><strong>[Update]</strong></p> <p>Since you mentioned you want to dynamically include a template based on the type, take a look at <code>ng-include</code> (<a href="http://docs.angularjs.org/api/ng.directive%3angInclude" rel="nofollow">docs</a>) which takes an Angular expression evaluating to a URL:</p> <pre class="lang-html prettyprint-override"><code><div ng-repeat="item in items"> <div ng-include="'input-' + item.type + '-template.htm'"></div> </div> </code></pre> <p>If you don't like the inline string concatenation, you can use a controller method to generate the URL:</p> <pre class="lang-html prettyprint-override"><code><div ng-repeat="item in items"> <div ng-include="templatePathForItem(item)"></div> </div> </code></pre> <p>The example on the <code>ngInclude</code> documentation page is pretty good.</p> <p>Note that the included template will be given a prototypal child scope of the current scope.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload