Question

我的API返回一个JSON数组，如下所示：

cars:[
  { 
    "id" : "1",
    "fabrication" : "AUDI",
    "description" : "some text",
    "image"       : "some image"
  },
  { 
    "id" : "2",
    "fabrication" : "BMW",
    "description" : "some text",
    "image"       : "some image"
  },
  { "id" : "3",
    "fabrication" : "MERCEDES",
    "description" : "some text",
    "image"       : "some image"
  },
  { 
    "id" : "4",
    "fabrication" : "PORSCHE",
    "description" : "some text",
    "image"       : "some image"
  }    
]

现在，我有一个在Handlebars HTMl模板中呈现的数据模型列表。我的目标是，单击某个项目，然后显示所单击项目的详细信息。

这是HTML

<div>
  {{#each this}}
    <div>
      <a class="item" item-id="{{id}}>
        <h1>{{fabrication}}</h1>
        <img src="{{someimage}}" />
      </a>
    </div>
  {{/each}
</div>

Backbone代码：

events: {
   'click .item': 'showDetails'
},

showDetails:function(e) {
    e.preventDefault();
    var item = $(e.currentTarget).data('id');
}

到目前为止，我得到了正确的ID，但我如何获取其余数据并将其显示在新视图中？

感谢任何帮助...

Answer 1

这里的问题是你的每辆车理想情况下都是一个视图本身。因此，您的车把不会有each，而是为您的汽车系列中的每个车型渲染ItemView。请查看Marionette's CollectionView和ItemView，了解我的意思。

但是，如果您想采用当前的方法，以下内容适合您：

showDetails:function(e) {
    e.preventDefault();

    var carId = $(e.currentTarget).data('id');

    var carModel = this.collection.findWhere({ id: carId });

    this.$('#extra-detail-container').html(new CarDetailView({ 
        model: carModel 
    }).render().el);
}

Backbone如何获取数组中的特定对象

1 个答案: