Question

我开始使用backbone.js使用backbone-boilerplate构建我的第一个项目。

我有一个名为Navitem的模块，其视图名为Sidebar：

Navitem.Views.Sidebar = Navitem.Views.Layout.extend({
    template: "navitem/sidebar",
    tagName: 'ul',
    beforeRender: function()
    {
      var me = this;
      this.options.navitems.each(function(navitem)
      {
        //insertView from Layout datatype
        me.$el.append(new Navitem.Views.Item({
          model: navitem //select the 'ul' in sidebar view and append an Item with model navitem
        }).render().el);
      });
      return this;
    }
  });

构建侧边栏时，会将包含许多Navitem.Model的集合传递给它。调试后，model:navitem似乎正常工作，并将右navitem模型传递给new Navitem.Views.Item({...})。该课程如下：

Navitem.Views.Item = Navitem.Views.Layout.extend({ 
    tagName: 'li',
    template: 'navitem/default'
    events: {
      click: "navRoute"
    },
    navRoute : function()
    {
      app.router.go(this.model.get('target'));
      return this;
    }
  });

模板看起来像<a href="#"><%= model.get('label') %></a>。

出于某种原因，当我在第一个代码块中调用Item.render()时，它会在视图中指出model未定义。我似乎无法弄清楚为什么会这样。有什么想法吗？

Answer 1

可能与此处回答的内容有关：Backbone.js: Template variable in element attribute doesn't work

您需要将模型作为普通JSON传递给您的模板（除非您使用的是另一个版本？）

希望这有帮助！

Answer 2

我在使用Backbone Boilerplate和Backbone LayoutManager编写的程序中做了类似的事情。

尝试将序列化函数添加到Navitem.Views.Item视图中：

// provide data to the template
serialize: function() {
    return this.model.toJSON();
}

然后在Navitem.Views.Sidebar的beforeRender函数中：

beforeRender: function(){
  _.each(this.options.navitems.models, function(model){
    var view = new Navitem.Views.Item({model: model});
    this.insertView(view);
  }, this);
}

并且navitem / default模板可能如下所示：

<%= label %>

这是未经测试的代码（使用您的视图和集合），但这样做对我来说很有用。

Backbone.js模型没有传递给视图

2 个答案: