如何使用字符串作为键在模型(Backbone.js)中设置多个属性?

时间:2014-11-27 13:38:03

标签: backbone.js

我有类似的问题:setting backbone models但我需要设置多个属性,而不仅仅是一个。

所以,我有一个模型,其中有人可以添加自定义属性,我有问题设置它们,因为如果我这样做:

parameter.set({
    name: nameValue, 
    value: valueValue,
    description: descriptionValue
});

其中name, valuedescription是字符串值,骨干是通过名称“name”,“value”和“description”创建一个新属性,但实际上我需要它们是值“名字”等。

如果我尝试这样做:

parameter.set(name, nameValue);
parameter.set(value, valueValue);
parameter.set(description, descriptionValue);

backbone只创建最后一行:parameter.set(description, descriptionValue);

当我尝试这样做时,同样的事情发生了:

parameter.attributes[name] = nameValue;
parameter.attributes[value] = valueValue;
parameter.attributes[description] = descriptionValue;               

所以,例如,假设我有这个HTML代码:

<input type="text" id="name"/>
<input type="text" id="nameValue"/>

<input type="text" id="value"/>
<input type="text" id="valueValue"/>

<input type="text" id="description"/>
<input type="text" id="descriptionValue"/>

其中:

var name = this.$('#name');
var nameValue = this.$('#nameValue');
var value = this.$('#value');
var valueValue = this.$('#valueValue');
var description = this.$('#description');
var descriptionValue = this.$('#descriptionValue');

1 个答案:

答案 0 :(得分:1)

您可以添加它们:

var name = this.$('#name').val();
var nameValue = this.$('#nameValue').val();
var value = this.$('#value').val();
var valueValue = this.$('#valueValue').val();
var description = this.$('#description').val();
var descriptionValue = this.$('#descriptionValue').val();

var params = {};

if (name) {
    params[name] = nameValue;
}
// the same for other attributes
// ....
// And at the end

model.set(params);

If语句将确保存在属性名称。然后将它们收集到一个空物体中。最后设置它们。

<强>更新

您可以在下面找到问题的working示例。填写输入,然后单击“提交”以对要构建的对象进行字符串化。

var MyForm = Backbone.View.extend({
    el: '#test', 
    events: {
        "click .submit": "showObject" 
    },
    showObject: function(e) {
      e.preventDefault();
      var name = this.$('#name').val();
      var nameValue = this.$('#nameValue').val();
      var value = this.$('#value').val();
      var valueValue = this.$('#valueValue').val();
      var description = this.$('#description').val();
      var descriptionValue = this.$('#descriptionValue').val();
      
      var params = {};

      if (name) {
          params[name] = nameValue;
      }
      
      if (value) {
          params[value] = valueValue;
      }
      
      if (description) {
          params[description] = descriptionValue;
      }
      
      
      this.model.set(params);
      
      
      this.$('.test-object').text(JSON.stringify(this.model.toJSON()));
    }});

var TestModel = Backbone.Model.extend({});

var myForm = new MyForm({model: (new TestModel()) });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.7.0/underscore.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone.js"></script>

<div id="test">
  <input type="text" id="name"/>
  <input type="text" id="nameValue"/>

  <input type="text" id="value"/>
  <input type="text" id="valueValue"/>

  <input type="text" id="description"/>
  <input type="text" id="descriptionValue"/>
  <div class="test-object"></div>
  <button class="submit">Show object</button>
</div>