Выберите шаблон представления по типу модели/объекту с помощью Ember.js

Я хотел бы хранить разные объекты в одном массиве содержимого контроллера и отображать каждый из них с использованием соответствующего шаблона представления, но в идеале это же представление.

Я выводил объекты списка, используя приведенный ниже код. Они в настоящее время идентичны, но я хотел бы иметь возможность использовать разные.

<script type="text/x-handlebars">
  {{#each App.simpleRowController}}
    {{view App.SimpleRowView class="simple-row" contentBinding="this"}}
  {{/each}}
</script>

Ниже приведена сокращенная версия представления. Другие функции, которые я не включил, могут быть использованы любым из объектов, независимо от модели. Поэтому в идеале я бы имел один вид (хотя я читал некоторые статьи о миксинах, которые могли бы помочь, если бы не было).

<script>
  App.SimpleRowView = Em.View.extend({
    templateName: 'simple-row-preview',
  });
</script>

Мои первые несколько тестов, позволяющих создавать разные типы объектов, оказались в сложных условиях в "simple-row-preview" - это выглядело ужасно!

Есть ли способ динамического управления именем шаблона или представлением, используемым во время итерации по моему массиву содержимого?

UPDATE

Большое спасибо двум респондентам. Последний код, используемый в представлении, приведен ниже. Некоторые из моих моделей похожи, и мне понравилась идея переключаться между шаблоном (или своего рода "состоянием" ) в моем приложении.

<script>
  App.SimpleRowView = Em.View.extend({
    templateName: function() {
      return Em.getPath(this, 'content.template');
    }.property('content.template').cacheable(),
    _templateChanged: function() {
      this.rerender();
    }.observes('templateName'),
    // etc.
  });
</script>

Ответ 1

Вы можете создать свойство templateName и затем определить, какой шаблон использовать на основе содержимого.

Например, это использует instanceof для установки шаблона на основе типа объекта:

App.ItemView = Ember.View.extend({
    templateName: function() {
        if (this.get("content") instanceof App.Foo) {
            return "foo-item";
        } else {
            return "bar-item";
        }
    }.property().cacheable()
});

Вот сценарий с рабочим примером выше: http://jsfiddle.net/rlivsey/QWR6V/

Ответ 2

Основываясь на решении @rlivsey, я добавил функциональность, чтобы изменить шаблон при изменении свойства, см. http://jsfiddle.net/pangratz666/ux7Qa/

App.ItemView = Ember.View.extend({
    templateName: function() {
        var name = Ember.getPath(this, 'content.name');
        return (name.indexOf('foo') !== -1) ? 'foo-item' : 'bar-item';
    }.property('content.name').cacheable(),

    _templateChanged: function() {
        this.rerender();
    }.observes('templateName')
});