从模板中的视图呈现表单

Question

我正在评估 backbone.js、backbone-form 和 Rails，我遇到了一些问题......

我

有一个视图，我在其中创建了一个新模型和一个表单，我想将此表单与其他 html 元素一起显示，所以我正在使用模板。

expedients_new.js.coffee
------------------------
class Globalbackbone.Views.ExpedientsNew extends Backbone.View
template: JST['expedients/new']
render: ->
@form = new Backbone.Form({
    model: @model
}).render();
console.log(@model.procedencia) 
console.log(@form) 
$(@el).html(@template(expedient: @model, form: @form ))
this

此视图使用模板，在此模板中，我想在那里呈现表单，但我不知道该怎么做......

new.jst.eco
-----------
<h1>BackBones with GlobalWeb</h1>
<h2>Adding New Expedient</h2>
<%=@expedient.date%>
<hr>
<%=@form.el%>
<hr>
<%=@form%>

提前感谢，

问候

编辑

我期望表单的当前浏览器输出是： [object HTMLFormElement]

Answer 1

使用说明指示@form将是主干视图：

var form = new Backbone.Form({
    model: user
}).render();

这意味着@form.el将是您需要插入到 DOM 中的 DOM 元素：

$('body').append(form.el);

如果你看一下源代码，你会发现Backbone.Form是一个Backbone.View子类：

var Form = (function() {
  return Backbone.View.extend({
    //...

您的代码试图将@form视为包含 HTML 的字符串：

<%=@form%>

所以你最终得到一个 DOM 元素的标准字符串化版本：[object HTMLFormElement] .

我认为如果你有这样的东西，你会有更好的运气：

@$el.append(@template(expedient: @model))
@$el.append(@form.el)

在您的模板中：

<h1>BackBones with GlobalWeb</h1>
<h2>Adding New Expedient</h2>
<%=@expedient.date%>
<hr>

然后您的表单应该出现在<hr>之后。