使用带有剃刀语法的淘汰赛绑定

Question

我想知道是否可以在 Razor 语法中使用 Knockout data-bind。

我认为有这段代码：

<tbody data-bind="foreach: relays">
    <tr>
        <td id="body-button-column">
            <button class="btn btn-default btn-sm" title="Remove relay" data-bind="click: $parent.removeRelay">
                <i class="glyphicon glyphicon-remove-circle"></i>
            </button>
        </td>
        <td><input type="text" data-bind="value: $index"/></td>
        <td>@Html.DropDownList("RelayConfigurations[" + $index + "].Address", Model.Addresses, "Select an Item")</td>
    </tr>
</tbody>

我的视图模型具有以下属性

self.relays = ko.observableArray(@Html.Raw(Json.Encode(Model.RelayConfigurations)));

其中 RelayConfigurations 是模型上的集合对象。

在使用 Razor 语法 @Html.DropDownList.... 的行中，我想对 $index 值使用敲除绑定，但不知道该怎么做。或者，如果有可能的话。

如果我将该行中的 $index 替换为硬编码值零，控制器操作中的模型绑定在 回发 上按预期工作（尽管只是集合中的第一个中继有任何数据，因为硬编码值为零）。

Answer 1

当然你可以在剃须刀中使用淘汰赛:)

我相信你正在寻找的是这个匿名对象方法：

@Html.DropDownList("somelist", Model.List, new { id = "listbox", data_bind = "" })

Answer 2

我理解的问题

1. 将 html 转换为在提交表单时容易被接受为服务器端模型的格式。
2. 能够从客户端向下拉列表添加项目。

第一个问题的解决方案是查看 DropdownList 的呈现 HTML 并复制生成的 <select> 标记，然后将 knockoutjs 应用于该标记，这样您将保持与服务器预期相同的格式能够在利用 knockoutjs 的同时将提交的表单转回服务器端模型

所以你最终会得到这样的东西

<tbody data-bind="foreach: relays">
    <tr>
        <td id="body-button-column">
            <button class="btn btn-default btn-sm" title="Remove relay" data-bind="click: $parent.removeRelay">
                <i class="glyphicon glyphicon-remove-circle"></i>
            </button>
        </td>
        <td><input type="text" data-bind="value: $index"/></td>
        <td>
           <select data-bind="attr: {id : 'RelayConfigurations[' + $index + '].Address' }, options: relays ,optionsCaption:'Select an Item'"></select>
        </td>
    </tr>
</tbody>

至于第二期，您已经拥有data-bind 的数据，因此您可以根据需要添加和删除项目。

来自@meyousikmann 下面的评论

只是对其他人来此答案的语法进行快速更正：

<select data-bind="attr: {name: 'RelayConfigurations[' + $index() + '].Address'}, options: $parent.addresses, optionsCaption: 'Select an Item'"></select>