Question

我试图在用户点击时将HTML元素附加到用户界面，这样的元素将在视图组件中组装和预编译，如下所示：

NewElementView = Ember.View.extend(
  tagName: 'li',

  click: ((event)->
    this.insertElement()
  ),

  blueprint: (->
    '<div id="{{dom_id}}">
      <textarea></textarea>
      <button {{action "submit"}}>Save</button>
     </div>'
  ).property()  

  insertElement: (->
    html = this.get("blueprint")
    template = Ember.Handlebars.compile(html)
    context = { dom_id: "foo" }
    Ember.$(template(context)).appendTo("#container")
  )
)

运行Ember.Handlebars.compile(html)行时会引发Uncaught TypeError: Cannot read property 'push' of undefined

知道为什么？

提前致谢！

Answer 1

Ember.Handlebars.compile期望一个具有数据属性的对象。

您可以通过以下方式实现您的目标

模板

<script type="text/x-handlebars" data-template-name="my-custom-view">
    <div {{bind-attr id='view.dom_id'}}>
      <textarea></textarea>
      <button {{action "submit"}}>Guardar</button>
    </div>
</script>

码

App.NewElementView = Ember.View.extend
  tagName: 'li'

  click: (event) ->
    @insertElement() 

  insertElement: ->
    view = Ember.View.create
      templateName: "my-custom-view"
      container: @container
      dom_id: "foo"

    view.appendTo("#container")

这是一个工作示例http://emberjs.jsbin.com/rapepepogi/17/edit?html,js,output

按需在Ember.view组件中编译的把手

1 个答案: