Question

我有一个模板：

<script type="text/template" id="action-template-item">
    <span data-layer="<%= target%>" data-uuid="<%= uuid%>">delete</span>
</script>

我在视图中渲染模板

    window.ActionView = Backbone.View.extend({
          template: $("#action-template-item").html(),
          initialize: function () {
                this.render();
          },
          render: function () {
              var tmpl = _.template(this.template);
              console.log(this.model);//model have "target"
              this.$el.html(tmpl(this.model));
              return this;
          }

    });

模板只有两个来自模型数据的属性

在渲染之前，我使用控制台来检查模型是否具有target值，答案是肯定的，就像上面的评论一样，

我的模型数据就像：

{
   target: "xxx-xxx-xxx",
   uuid: "xxx-xxx-xx"
}

但是萤火虫告诉我"target is not defined"

发生了什么事？我的代码出了什么问题？

Answer 1

您的模型可能看起来像这样：

var M = Backbone.Model.extend({});
var m = new M({
   target: "xxx-xxx-xxx",
   uuid: "xxx-xxx-xx"
});

演示（打开控制台，您会看到错误）：http://jsfiddle.net/ambiguous/Rnd6k/

所以当你说

时

//model have "target"

你可能意味着this.model.attributes.target存在。 Backbone模型属性和JavaScript对象属性不是一回事，Underscore模板将寻找对象属性，他们对Backbone模型属性一无所知。

通常的做法是在要渲染视图时使用toJSON序列化模型：

render: function () {
    var tmpl = _.template(this.template);
    this.$el.html(tmpl(this.model.toJSON()));
    return this;
}

演示：http://jsfiddle.net/ambiguous/Rnd6k/

backbone.js：模板无法识别模型

1 个答案: