【问题标题】:Knockout Template: Own BindingContext, same Parents淘汰赛模板:自己的 BindingContext,相同的父母
【发布时间】:2015-02-03 14:02:25
【问题描述】:

我正在编写一个 bindingHandler 并且想要创建一个具有 相同的父母/父母上下文的绑定上下文,就像 current bindingContext。阅读:没有额外的绑定上下文层次结构。

背景:我写了一个对话框绑定处理程序
dom-node 有一个对话框绑定,如data-bind="dialog: { childTemplate: 'childTemplateId' }"
点击后,一个通用对话框模板被渲染并附加到正文。您还指定一个 child-template(= 是所需的具体视图),它由 binding-context-variable @ 的通用对话框模板选择987654322@.
子模板应该不知道在它和包含对话框绑定处理程序的级别之间有一个额外的层(= 通用对话框模板)。所以$parent,$parent.$parent,$parent.$parent.$parent,...在子模板和具有data-bind="dialog: ..."的dom节点中是相同的。

我想要一个额外的绑定上下文,这样我就可以使用特定于这个“对话调用”的属性来扩展它,这样当前的绑定上下文就不会被污染。

【问题讨论】:

    标签: javascript templates knockout.js binding-context


    【解决方案1】:

    好的,看来
    bindingContext.$parentContext.createChildContext(childViewModel);
    完美运行!
    所以使用$parentContext 是(非常合乎逻辑的)方法。

    (如果我没记错的话,我之前尝试过这个方法,但以前版本的淘汰赛没有成功......但没关系)

    【讨论】:

      【解决方案2】:

      bindingContext.extend 返回一个新的 bindingContext:

      ko.bindingHandlers.dialog = {
          init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
              var innerBindingContext = bindingContext.extend({
                  dialogProperty1: ...
              });
              ko.applyBindingsToDescendants(innerBindingContext, element);
      
              return { controlsDescendantBindings: true };
          }
      };
      

      所以这应该可以实现您想要实现的目标:具有相同层次结构和特定于对话框的扩展的新 bindingContext,不会污染对话框绑定之外的上下文。

      【讨论】:

      • 我不能使用{controlsDescendantBindings: true },因为包含data-bind: "dialog: ..." 的dom-node 可以包含有自己绑定的内容......所以如果我使用它,则会引发“绑定两次”错误。但是,我找到了一个可行的解决方案。但是感谢您的努力!
      • 应该是反过来吧? controlsDescendantBindings: true 防止绑定被绑定两次。
      • 是的,但是我的代码在 click-event 上执行模板 - 很久以后。所以实际上对话调用节点的子节点(坏名字,我知道)必须受到淘汰赛的约束。
      • 遇到问题 - 我错过了您使用模板的部分,并认为“对话”的子节点在其中的内容。我当时以几乎相同的方式解决了这个问题。 Here's my binding,如果你有兴趣的话。
      • 嘿,谢谢,也许我仔细看看。 @code:您直接传递您的视图模型而不是创建 bindingContext - 这是故意的吗?因为您以这种方式失去了父母(如果我没记错的话)。 ko.renderTemplate(veilTemplate, bindingContext.$parentContext.createChildContext(valueAccessor()), {}, overlay.get(0)) 将有助于留住父母 ;)
      猜你喜欢
      • 1970-01-01
      • 2012-07-16
      • 1970-01-01
      • 2018-09-05
      • 2011-08-11
      • 1970-01-01
      • 1970-01-01
      • 2014-10-24
      • 2015-04-28
      相关资源
      最近更新 更多