Javascript 在自定义组件加载程序中通过“createViewModel”函数更改模板

在knockoutjs中，我有一个自定义组件加载器，在其中执行一些逻辑。基本上我想从createViewModel函数中修改模板。我知道有

componentInfo.templateNodes

，但我不知道如何处理它

我想在createViewModel函数中修改它的原因是，每次显示组件时都会调用createViewModel函数

嗯，代码比文字更能说明问题，所以你自己来看看吧

ko.components.loaders.unshift({
    getConfig: function (name, callback) {
        var component;  // The component gets loaded somewhere. (Sadly I can't alter the template here because it is only called once.)

        callback({
            viewModel: {
                createViewModel: function (params, componentInfo) {
                    // Load these parameters somewhere
                    var args;
                    var location;

                    // I'd love to add these two items before and after my template.
                    var before = "<div data-bind=\"with: " + location + "\">";
                    var after = "</div>";

                    // Construct a viewModel with the data provided. 
                    return app.core.helpers.construct(component.viewModel, location, args);
                }
            },
            template: component.template
        });
    },

    loadTemplate: function (name, template, callback) {
        // Get the location again.
        var location;

        // I just want to load the template while applying the correct binding scope from the createViewModel.
        var templateString = "<!-- ko stopBinding: true -->\n<!-- ko with: " + location + " -->\n" + template + "\n<!-- /ko -->\n<!-- /ko -->";

        // Just let it load.
        ko.components.defaultLoader.loadTemplate(name, templateString, callback);
    }
});

ko.components.loaders.unshift({
getConfig:function（名称，回调）{
var component；//该组件被加载到某个地方。（遗憾的是，我不能在这里更改模板，因为它只被调用一次。）
回拨({
视图模型：{
createViewModel:函数（参数、组件信息）{
//将这些参数加载到某个地方
var-args；
var定位；
//我想在模板之前和之后添加这两项。
前var=”；
var在“”之后；
//使用提供的数据构建viewModel。
return app.core.helpers.construct（component.viewModel，location，args）；
}
},
模板：component.template
});
},
loadTemplate:函数（名称、模板、回调）{
//再次获取位置。
var定位；
//我只想在从createViewModel应用正确的绑定范围时加载模板。
var templateString=“\n\n”+模板+“\n\n”；
//让它加载。
ko.components.defaultLoader.loadTemplate（名称、templateString、回调）；
}
});

我设法创建了一个有效的解决方案（尽管还处于婴儿期）。由于我仍然不知道如何向componentInfo添加模板代码，我发现可以编辑componentInfo中可用的内容。（参见下面的解决方案）

ko.components.loaders.unshift({
getConfig:function（名称，回调）{
var分量；
回拨({
视图模型：{
createViewModel:函数（参数、组件信息）{
//将这些参数加载到某个地方
var-args；
var定位；
/*
*第一个是我们要绑定的元素，下一个同级是我们可能要更改的元素。
*/ 
if（componentInfo.element.nextSibling.nodeType==8&&componentInfo.element.nextSibling.nodeValue.indexOf（“[injectNamespace]”）大于-1）{
componentInfo.element.nextSibling.nodeValue=“ko with:models.”+name.replace（“/”，“.”）；
}
return app.core.helpers.construct（component.viewModel，location，args）；
}
},
模板：component.template
});
},
loadTemplate:函数（名称、模板、回调）{
var templateString=“\n”+模板+“\n”；
ko.components.defaultLoader.loadTemplate（名称、templateString、回调）；
}
});

ko.components.loaders.unshift({
    getConfig: function (name, callback) {
        var component;

        callback({
            viewModel: {
                createViewModel: function (params, componentInfo) {
                    // Load these parameters somewhere
                    var args;
                    var location;

                    /*
                     *  The first one is the element we're binding on. The next sibling is the element we probably want to alter.
                     */ 
                    if (componentInfo.element.nextSibling.nodeType == 8 && componentInfo.element.nextSibling.nodeValue.indexOf("[injectNamespace]") > -1) {
                        componentInfo.element.nextSibling.nodeValue =  "ko with: models." + name.replace('/', '.');
                    }

                    return app.core.helpers.construct(component.viewModel, location, args);
                }
            },
            template: component.template
        });
    },

    loadTemplate: function (name, template, callback) {
        var templateString = "<!-- ko with: [injectNamespace] -->\n" + template + "\n<!-- /ko -->";

        ko.components.defaultLoader.loadTemplate(name, templateString, callback);
    }
});