本文介绍了KnockoutJS“与"在模型可用之前进行绑定的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

限时删除!!

我有一个使用KnockoutJS的ASP.NET MVC4 SPA Web应用程序,这有点尴尬,因为据我了解,当页面最初加载到SPA中时,通常只有AJAX调用检索到该数据后,才会有数据.当我尝试使用data-bind="with: myData"之类的属性将块中的所有数据绑定在一起时,该节点内的整个DOM都将被清空,直到myData变为有效,这使我感到不安,如果某些脚本可能依赖于可用于这些元素的元素将脚本附加到某物上.在加载过程中让页面的大部分消失并重新出现看起来也很糟糕.因此,我设计了with绑定的一种变体,如果该值为空,它将阻止子代绑定,当前值为:

I have an ASP.NET MVC4 SPA web application using KnockoutJS, which is a bit awkward because, as I understand it, when the page initially loads in an SPA there is generally no data until an AJAX call retrieves it. When I try to bind all sorts of data inside a block with an attribute like data-bind="with: myData", the whole DOM inside that node is emptied out until myData becomes valid, which makes me nervous if certain script might be relying on having those elements available to attach script to or something. It also looks bad to have chunks of the page disappearing and reappearing during the load process. So I've devised a variation of the with binding that will prevent descendant bindings if the value is empty, which currently looks like this:

ko.bindingHandlers.safeWith = {
    'init': ko.bindingHandlers.with.init,
    'update': function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        var value = ko.utils.unwrapObservable(valueAccessor());
        if ((value != undefined) && (value != null))
            ko.bindingHandlers.with.update(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext);
    }
};

然后,我只是使用safeWith而不是with来确保在等待填充myData时,我的DOM不会消失.

Then I simply use safeWith instead of with to make sure my DOM doesn't go away while waiting for myData to be populated.

我的问题是:

  1. 这是使用剔除的SPA的常见问题吗?如果是,通常如何处理?
  2. 我的处理方式是安全的吗?还是我冒着以某种方式应用重复的事件/绑定的风险,还是我不知道的某些风险?
  3. 我对在网络上学习的淘汰赛和相关技术感到惊讶,这是我从未遇到过的.当绑定到的对象为空时,是否有充分的理由让首选使DOM的各个部分消失?我试图保持错误状态吗?
  1. Is this a common problem with SPAs using knockout, and if so, how is it normally dealt with?
  2. Is my way of dealing with this safe or do I risk duplicate events/bindings being applied somehow or some risk I'm not aware of?
  3. I'm surprised in my roaming about the web learning about knockout and related technologies I haven't run across this. Are there good reasons to prefer having sections of the DOM to go away when the object to which they're bound is empty; am I making a mistake by trying to keep it around?

推荐答案

我实现了一个自定义的bindIf绑定处理程序,该处理程序通过将绑定逻辑推迟到可观察对象内部具有有效值来显着改善了我们的结果:

I have implemented a custom bindIf binding handler that improved our results significantly by postponing binding logic until the observable has a valid value inside it:

ko.bindingHandlers.bindIf = {
    'init': function (element, valueAccessor) {
        return { 'controlsDescendantBindings': true };
    },
    'update': function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        if (!$(element).data("bindIfPassed") && valueAccessor()) {
            $(element).data("bindIfPassed", true);
            ko.applyBindingsToDescendants(bindingContext, element);
        }
    }
}

应用于这样的高级节点:

Applied to a high level node like this:

<div data-bind="bindIf: myObservable()">

这篇关于KnockoutJS“与"在模型可用之前进行绑定的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

1403页,肝出来的..

09-06 21:50