将ko绑定应用于局部视图

Question

我有一个ko viewmodel.我想在同一页面上渲染两次局部视图.一次是物理地址,一次是邮寄地址.它们具有相同的属性,数据只是不同.没有客户端淘汰父视图模型,其中包含物理和邮政地址.我得到了"你不能多次对同一个元素应用绑定".提取下面.我可以创建一个名为地址的淘汰模型,它将包含物理和邮政,然后使用带有2个div的部分绑定(一个用于邮政,一个用于物理).我猜这会奏效.但除非必要,我真的不想创建父模型.任何建议？

页:

@Html.Partial("_Address", Model.PhysicalAddress)
@Html.Partial("_Address", Model.PostalAddress)

部分:

@model Models.AddressDetailsViewModel
<div id="myDiv">
        <table class="my-table">
                <tr>
                    <td id="postalCode">
                        <span data-bind="text: props.postalCode">
                        </span>
                    </td>
                </tr>               
        </table>
    </div>

<script type="text/javascript">
    var data = @(Html.Raw(Json.Encode(Model)));
    var viewModel = mapAddress(data);
    ko.applyBindings(viewModel, $("#myDiv")[0]);
</script>

Answer 1

您可以使用withKnockout 中的绑定将 ViewModel 的各个部分绑定到可重用的部分视图。我不久前写了一篇关于此的博客文章：

https://conficient.wordpress.com/2013/03/07/knockout-multiple-viewmodels-and-reusable-partial-views/

我实际上在示例代码中使用了地址作为示例，因此您应该会发现这很有帮助。在您的示例中，您将这样做：

<div data-bind="with: physicalAddress">
    @Html.Partial("_Address")
</div>

<div data-bind="with: postalAddress">
    @Html.Partial("_Address")
</div>

这假设两个 DIV 位于主 ViewModel 绑定上下文中。请注意，如果任一地址未定义或为空，则该地址 HTML 将不可见。

正如 @shailendra-kumar 也指出的那样，Knockout 3.2 版本引入了组件的概念。从长远来看，这是一个更好的方法，但片面的观点也应该有效。