Backbone Model Binder:属性不在模型上

时间:2013-09-25 13:16:20

标签: backbone.js model-binding marionette backbone-views

我使用Backbone牵线木偶与骨干模型粘合剂。

使用下面的代码,如果select + input [type = date]的默认值已完成且用户未更改它们,则当用户单击“保存”时,模型属性将返回空白。如果用户在字段上进行编辑并单击“保存”,则会在模型属性上设置该字段。

define(["marionette", "underscore", "text!app/templates/sicknesses/form.html", "app/models/sickness", "app/collections/users"], function(Marionette, _, Template, Model, Users) {
  "use strict"
  return Backbone.Marionette.CompositeView.extend({
    events: {
      "click #createButton": "onClickSave"
    },
    _modelBinder: undefined,
    initialize: function(options) {
      var that
      this._modelBinder = new Backbone.ModelBinder()
      this.mode = 'create'
      this.users = new Users()
      this.users.on("reset", this.render, this)
      this.users.fetch()
      this.model = new Model()
    },
    onClickSave: function(ev) {
      ev.preventDefault()
      console.log(this.model.attributes)
    },
    render: function() {
      var bindings, html
      if (this.users.length > 0) {
        bindings = {
          start_date: "#start_date",
          end_date: "#end_date",
          sicknote: "#sicknote",
          user: "#user"
        }
        html = _.template($(Template).html(), {
          model: this.model.toJSON(),
          users: this.users.toJSON(),
          mode: this.mode
        })
        this.$el.html(html)
        this._modelBinder.bind(this.model, this.$el, bindings)
      }
      return this
    }
  })
})

1 个答案:

答案 0 :(得分:2)

这是正确的行为。数据应该由模型而不是视图驱动。

来自Doc

  • “调用bind()函数时,模型的绑定属性将从模型复制到绑定元素。调用bind()时,不会将视图元素默认值复制到模型中。这种行为通常属于Backbone.Model默认块。“

我们有一个类似的用例来用View初始化模型,并且添加了一个功能来将初始数据从View复制到模型

  • “如果你需要在调用bind()时将值从视图复制到模型,我首先会问为什么。在大多数情况下,特别是单页网页应用程序,让模型驱动应用程序而不是视图的行为几乎总是更好。如果需要此行为,可以将第4个可选参数用于bind()函数。 {initialCopyDirection:Backbone.ModelBinder.Constants.ViewToModel}您还可以通过调用Backbone.ModelBinder.SetOptions({initialCopyDirection:Backbone.ModelBinder.Constants.ViewToModel})来指定此行为作为所有ModelBinder的默认行为;“

需要更新bind调用以添加第4个参数:

this._modelBinder.bind(this.model, this.$el, bindings, {initialCopyDirection: Backbone.ModelBinder.Constants.ViewToModel});

希望这有帮助!