Скомпилируйте шаблонную сторону клиента в ember, используя HTMLbars

Question

Я создал CMS, где можно использовать HTML-панели для создания шаблонов. Шаблоны должны быть скомпилированы на стороне клиента, и есть компонент, который должен отображать шаблон. Я устанавливаю свойство шаблона компонента для функции, которая возвращает скомпилированный шаблон с использованием HTMLBars.

import Ember from 'ember';

export default Ember.Component.extend({
  content: null,
  template: function () {
    return Ember.HTMLBars.compile(this.get('content.template'));
  }
}

Я включил ember-template-compiler в мой Brocfile.

app.import('bower_components/ember/ember-template-compiler.js');

также проверено

app.import('bower_components/ember-template-compiler/index.js');

Но шаблон никогда не отображается.

Answer 1

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

http://emberjs.jsbin.com/vayereqapo/1/edit?html,js,output

Ember.Component.extend({
  content: {template: 'Hello'},
  layout: function () {
    return Ember.HTMLBars.compile(this.get('content.template'));
  }.property()
});

Повторное отображение при изменении содержимого шаблона:

App.FooBarComponent = Ember.Component.extend({
  content: {template: 'Hello'},
  foo: function(){
    var self = this;
    Em.run.later(function(){
      self.set('content.template', 'Bye');
      self.rerender();
    }, 3000);
  }.on('init'),
  layout: function () {
    return Ember.HTMLBars.compile(this.get('content.template'));
  }.property('content.template')
});

http://emberjs.jsbin.com/qebuxuxasu/1/edit