Question

我试图绑定一个淘汰赛模板并且无法解决问题，我已经尝试过一百万件事。

我现在已经迷失了任何想法，我几天来一直在调试它。

同样的模板也可以在其他页面上获取，并且工作正常。

我尝试过打印$ data对象并显示数据可用，但是在同一个模板上它没有绑定价值观。

我得到Uncaught TypeError: Unable to process binding "with: function (){return selectedView }" Message: Unable to process binding "template: function (){return {name:templateName,data:data} }" 由于模板没有绑定，基本上是一串错误。这里有一些观看代码：

#page-hold{data: {role: 'page', theme: 'a'}}
  .container{ "data-bind" => "with: selectedView"}
    %div{ "data-bind" => "template : {name: templateName, data: data}" , data: {role: 'content'}}


%script{ "id" => "tpl_landing", "type" => "text/html"}

//html partials

数据对象看起来像这样

{
  "views": [
    {
      "title": "landing",
      "templateName": "tpl_landing",
      "data": {
        "base": {
        /// data
        }

最新更新：我对此问题有了更深入的了解，经过多次调试后，我发现可以在内部访问viewModel（$ data对象） iframe但它不会绑定或输出除$ data对象之外的页面上的任何内容，这为我提供了所有数据的JSON。想知道为什么当我看到数据存在时数据没有被绑定。

任何能帮我调试的人都会这样做吗？

谢谢

Answer 1

Knockout支持跨窗口绑定（在窗口之间共享视图模型），但它不直接支持在窗口之间共享模板。（您可以编写自定义templateEngine，但这非常先进。）

我想出了一个应用模板的绑定，并绑定了我认为会做你想做的<iframe>。

ko.bindingHandlers.iframeTemplate = {
    update: function (element, valueAccessor) {
        var iframedoc = element.contentDocument,
            options = valueAccessor(),
            templateSource = ko.templateEngine.prototype.makeTemplateSource(ko.unwrap(options.template)),
            templateText = templateSource.text(),
            templateNodes = ko.utils.parseHtmlFragment(templateText, iframedoc),
            iframebody = iframedoc.body;

        ko.virtualElements.setDomNodeChildren(iframebody, templateNodes);
        ko.applyBindings(options.data, iframebody);
    }
};

用法示例：http://jsfiddle.net/mbest/udhm4qj4/

Knockout绑定错误，无法绑定iFrame中的viewModel

1 个答案: