I am using Ember, Ember Data, and Handlebars to display a timeline with a number of different types of models. My current implementation, though functioning properly, seems like it could be drastically improved with a convention and a helper. However, I can't figure out how to use already defined templates.
This is what I have:
{{#view App.AccountSelectedView contentBinding="App.selectedAccountController.everythingSorted"}}
{{#with content}}
<ol class="timeline">
{{#each this}}
{{#is constructor="App.Design"}}
... stuff about the design
{{/is}}
{{#is constructor="App.Order"}}
... stuff about the order
{{/is}}
{{#is constructor="App.Message"}}
... stuff about the message
{{/is}}
{{/each}}
</ol>
{{/with}}
{{/view}}
...along with a helper...
Handlebars.registerHelper('is', function(options) {
if (this.constructor == options.hash["constructor"]) {
return options.fn(this);
}
});
I would rather rely on some convention to figure out what view to render. For example:
<script type="text/x-handlebars-template" data-model="App.Design" id="design-view">
... stuff about the design
</script>
<script type="text/x-handlebars-template" data-model="App.Order" id="order-view">
... stuff about the order
</script>
Perhaps the data-model attribute could be used to determine how an object is rendered.
{{#view App.SelectedAccountView contentBinding="App.selectedAccountController.everythingSorted"}}
{{#with content}}
<ol class="timeline">
{{#each this}}
{{viewish this}}
{{/each}}
</ol>
{{/with}}
{{/view}}
Alas, I can't figure out how to access templates from a helper.
Handlebars.registerHelper('viewish', function(options) {
// Were I able to access the templates this question
// would be unnecessary.
// Handlebars.TEMPLATES is undefined...
});
Also, is this something I should want to do with Handlebars?