当页面作为部分通过ajax加载时,如何重新绑定knockout viewmodel

发布时间：2020-12-16 02:53:22 所属栏目：百科来源：网络整理

导读：我正在使用的页面有几个选项卡,每个选项卡的内容通过ajax从控制器请求部分视图加载.问题是局部视图使用knockoutjs,因此它被绑定到视图模型.在这个特定的场景中,页面首次完整地加载,因此所有绑定都可以正常工作.切换选项卡时,它会请求部分视图,并用新页面替换

我正在使用的页面有几个选项卡,每个选项卡的内容通过ajax从控制器请求部分视图加载.问题是局部视图使用knockoutjs,因此它被绑定到视图模型.在这个特定的场景中,页面首次完整地加载,因此所有绑定都可以正常工作.切换选项卡时,它会请求部分视图,并用新页面替换选项卡内容区域.当你切换回第一个标签时,它会成功加载部分,除非看起来所有的敲除绑定都已丢失,因此存在大量缺失数据.

我无法将viewmodel声明和模型绑定放在partial中,因为该点尚未加载jquery.或者似乎($未定义).

视图模型在调用局部视图的主页面上声明和绑定,而不是局部视图本身,所以我认为模型仍然可用并且绑定成功,但事实并非如此.我知道我做错了,当谈到javscript时,部分视图是非常难以理解的,所以我希望能从你们那里窃取一些洞察力.

这是基本设置：

解决方法

如果您能够绑定到页面的特定非重叠区域,那么您可以选择调用ko.applyBindings(someViewModel,someDomElement),如下面的答案： Can you call ko.applyBindings to bind a partial view?

但是,如果你有一个绑定到页面的整体视图模型,然后是通过你想要稍后绑定的部分加载的内容的“孤岛”,那么一个选项就是这样：http://www.knockmeout.net/2012/05/quick-tip-skip-binding.html.所以,你会在你的偏见所在的容器上设置一个绑定,告诉Knockout将其手离开那个区域.然后当你加载partial时,你可以安全地调用ko.applyBindings(someViewModel,innerContainer).

绑定可能如下所示：

ko.bindingHandlers.stopBinding = {
    init: function() {
        return { controlsDescendantBindings: true };
    }
};

你会像以下一样使用它：

<div id="outerContainer" data-bind="stopBinding: true">
    <div id="innerContainer">
     ...load your partial here
    </div>
</div>

然后,ko.applyBindings(someViewModel,document.getElementById(“innerContainer”));

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!