Knockout.js 使用绑定的knockout JS重用局部视图

在登录页中，我对部分视图应用了绑定。（“myModalSeeAllDrafts”）

登录页：

@Html.Partial("~/Views/Home/JumpStartYourJourney/_SeeAllDrafts.cshtml")

var journeyDrafts = {
                dataUrl: '@Url.Action("GetSeeAllDraftsData", "Home")',
                selectUrl: '@Url.Action("GetDraftJourney", "Home")',
                deleteUrl: '@Url.Action("DeleteDraftBooking", "Home")'
            };

 var journeyDraftsVM = new JourneyDraftsViewModel(journeyDrafts);
            ko.applyBindings(journeyDraftsVM, $("#myModalSeeAllDrafts")[0]);

我想从另一个视图重用部分

旅游景点：

@Html.Partial("~/Views/Home/JumpStartYourJourney/_SeeAllDrafts.cshtml")

var url = {
            dataUrl: '@Url.Action("GetSeeAllDraftsData", "Home")',
            selectUrl: '@Url.Action("GetDraftJourney", "Home")',
            deleteUrl: '@Url.Action("DeleteDraftBooking", "Home")',
        };
        var journeyDraftsViewModel = new JourneyDraftsViewModel(url);
        ko.applyBindings(journeyDraftsViewModel, $("#myModalSeeAllDrafts")[0]);

我得到一个错误，Uncaught语法错误：不能对同一个元素多次应用绑定。 是不是，一旦你进入另一个页面，该视图的绑定已经过期了

---

请帮助。

您必须将第二个绑定更改为：

$（“#myModalSeeAllDrafts”）[1]

但这不是一个好方法，因为有两个或多个元素具有相同的id：可以将id作为参数发送，以在partialview中包含元素

@Html.Partial("_SeeAllDrafts", "id2")
@Html.Partial("_SeeAllDrafts", "id1")

部分地：

@model string

<div id='@Model'>
    <span data-bind="text: name"></span>
</div>

---

嗨，谢谢你的提示irfan，我遵循了你提供的每一个提示，但是我仍然得到了一个未捕获的语法错误：不能对同一个元素多次应用绑定。除了Html.Partial（提供id）的另一个参数外，我得到了一个InvalidOperationException。我更新了我的答案，对传递给视图的参数进行了修改。我有一个问题。目前我的局部视图中有一个模型。你能告诉我如何在一个视图中放置两个模型吗？谢谢你的回答。我已经修改了我的代码。是的，ViewModel正在处理这两个视图，谢谢你，但是我仍然被一个未捕获的语法错误抓住了，这个错误是关于我不能多次应用绑定。部分视图工作正常，但视图的其他功能（尤其是第二个applybindings）工作不正常。不能对页面的同一部分应用多个绑定。查看页面源并搜索“applyBindings”

@section scripts
{
    <script type="text/javascript">
        $(function () {
            var journeyDraftsViewModel = { name: "refan" };
            ko.applyBindings(journeyDraftsViewModel, document.getElementById('id1'));
            ko.applyBindings(journeyDraftsViewModel, document.getElementById('id2'));
        });
    </script>
}

<div id="id1">
    @Html.Partial("_SeeAllDrafts")
</div>

<div id="id2">
    @Html.Partial("_SeeAllDrafts")
</div>

$(function () {
     var journeyDraftsViewModel = { name: "refan" };
     ko.applyBindings(journeyDraftsViewModel, document.getElementById('id1'));
     ko.applyBindings(journeyDraftsViewModel, document.getElementById('id2'));
});

$(document).ready(function () {
    var journeyDraftsViewModel = new JourneyDraftsViewModel(url);
    ko.applyBindings(journeyDraftsViewModel);
});