如何在 BackboneJS 中顯示 Model 屬性的 select 列表（下拉列表）？

Question

我正在嘗試在 Backbone.js 中構建一個簡單的聯系人編輯器應用程序，但我遇到了一些我不知道如何解決的問題，因為我還不熟悉 Backbone.js。

我有一個 Model Contact ，該項目有一個ProductLineID字段（每個聯系人都有一個與之關聯的產品線）。 在顯示此聯系人的編輯器時，我想顯示一個下拉列表，其中包含可能的 ProductLine 選項並將其預設為當前值。 我將如何在 Backbone.js 中做到這一點？

我知道如何在 knockout.js 中進行數據綁定：

<select id="ProductLineID" name="ProductLineID"
        data-bind="options: productLineOptions, 
        optionsValue: 'ID', 
        optionsText: 'Name', 
        value: ProductLineID, 
        optionsCaption: 'All'">
</select>

在此示例中，productLineOptions 是已在頁面上預加載的 JSON object。

這將完全實現我想要的，但我不知道如何在 Backbone.js 中做同樣的事情。

我可以從我的實際示例中提供更多代碼，但這似乎是一個微不足道的示例，不需要特定代碼。

Answer 1

如果您使用下划線模板，則類似以下內容會起作用：

<select id="ProductLineID" name="ProductLineID">
    <option value="">--select a product line--</option>
    <% _(productLineOptions).each(function(pl) { %>
      <option value="<%= pl.ID %>"><%= pl.Name %></option>
    <% }); %>
</select>

然后您只需確保將productLineOptions傳遞到模板的上下文中。

Answer 2

Backbone.js 不像 Knockout 那樣開箱即用地進行數據綁定。 它將這方面留給開發人員按照他們的意願去做。 基本方法是為更改設置事件偵聽器。

如果你確實想做淘汰賽風格的數據綁定，有一個項目可以支持你所需要的。

https://github.com/derickbailey/backbone.modelbinding