如何为Marionette模板提供数据属性？

Question

在这里,我处于项目的开始阶段.我正在使用zurb-foundation和牵线木偶.我有一个元素正在渲染一个应该是标签的模板.目前的情况:

define([
  "backbone",
  "marionette"
], function(Backbone, Marionette) {

  MyItem = Backbone.Marionette.ItemView.extend({
    template: "#design-tabs",
    className: "section-container tabs",

    onRender: function() {
      $(this.el).foundation();
    }
  });

  return MyItem;
});

没有标签.我认为这是因为<div>渲染替换<script模板中的>标签没有特定的数据属性(数据部分).我去寻找类似'className'的东西,我可以添加到上面的ItemView声明中以包含数据属性,但我已经干了.我想要的东西:

MyItem = Backbone.Marionette.ItemView.extend({
  template: "#design-tabs",
  data: {
    data-section: "",
    data-foo: "bar"
  },
  className: "section-container tabs",
  .
  .
  .

如何将数据属性添加到<div>替换<script>模板中的(或其他)？

Answer 1

要添加数据属性,请使用Backbone的attributes哈希:

var MyView = Backbone.Marionette.ItemView.extend({
  template: "#design-tabs",
  className: "section-container tabs",
  attributes: {
    "data-section": "",
    "data-foo": "bar"
  }
});

文档:http://backbonejs.org/#View-attributes

Answer 2

如果您更喜欢或需要动态值,可以这样做:

attributes: function() {
  return {
    'src': this.model.get('avatar_src')
  };
}