C# 结合razor语法使用knockout绑定

我想知道是否可以在Razor语法中使用剔除

数据绑定

我认为有以下代码：

<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>

其中RelayConfiguration是模型上的集合对象

在使用Razor语法的行中

@Html.DropDownList

。。。。我想为$index值使用敲除绑定，但不确定如何做到这一点。或者如果可能的话

---

如果我将该行中的

$index

替换为硬编码值零，则控制器操作中的模型绑定在回发时会按预期工作（尽管由于硬编码值为零，只有集合中的第一个中继具有任何数据）。

当然，您可以在razor:）中使用knockout）

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

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

---

我所理解的问题

将html转换成一种格式，在提交表单时可以很容易地接受为服务器端模型

从客户端向dropdownList添加项目的功能

第一个问题的解决方案是查看DropdownList的呈现HTML，复制生成的

标记，然后对其应用

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>

---

我相信你已经知道了，但是Razor是一种服务器端技术，Knockoutjs是一种客户端技术。虽然可以很好地完成，但有时您最好选择其中一个，以实现在page.Understand上显示和捕获数据的最终结果。我选择混合它们的原因是因为中继配置列表是一个动态大小的列表，用户可以添加到其中或从中删除。在更新UI时，使用击倒可观察数组似乎是管理动态大小列表的最干净、最有效的方法；然而，我有两个问题。显示的语法不起作用。我不能在您指出的地方使用“数据绑定”。Intellisense表示该符号无法解析。其次，为了使MVC模型绑定器正确工作，表单字段名称必须与模型属性的名称匹配。DropDownList的Razor语法表示第一个参数是名称。这就是我想要使用数据绑定的论点。在我的原始帖子中的代码中，我试图指出我需要在DropDownList的第一个参数中使用$index符号进行数据绑定的位置。没错，我忘记了破折号可能是毛茸茸的。如果使用data_bind，则此方法应该有效，请阅读此处：。好的，这是另一种方法。不使用Razor语法，但仍然有效。对于其他回答此问题的人，请快速更正语法：。谢谢你给我指明了正确的方向。我仍然很想知道是否可以用Razor语法来完成。我怀疑是否有一种有效的方法来完成这类事情。问题是Razor和knockout对彼此的存在一无所知。你可以试试看。我自己没有用过它，但可能值得一看。我投了反对票，因为它实际上并没有提供问题的答案，而是提供了一种替代的解决方法。问题是Razor在服务器上运行，knockout在浏览器/客户端上运行。对于Razor来说，要了解淘汰赛是不容易的。或者让击倒者了解剃刀。它们是试图实现类似结果的根本不同的技术。

<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>

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