0

我最近更新到 3.2,我真的很想利用可用的自定义元素和组件绑定。

现在我制作了一个这样的自定义组件加载器:

export class KnockoutComponentLoader implements IKnockoutTemplateLoader, IKnockoutViewModelLoader
{
    public loadTemplate(name: string, templateConfig: any, callback:Function)
    {
        console.log("Loading template: {0}".format(name));
        // Do some other stuff
    }

    public loadViewModel(name: string, viewModelConfig: any, callback:Function)
    {
        console.log("Loading vm: {0}".format(name));
        // Do some other stuff
    }
}

它是一个打字稿模块,但它被转换为 JS 并使用以下方式注册:

var knockoutComponentLoader = new Framework.Loaders.KnockoutComponentLoader();
ko.components.loaders.unshift(knockoutComponentLoader);

我已经在 FF 中进行了调试,一切似乎都按预期工作,然后我在几行之后进行了以下注册:

componentConfigurator.RegisterComponent("heading-menu", "shared", "HeadingMenuVM", "heading-menu");

我有一个类用于使用我的自定义加载器完成注册:

export class ComponentConfigurator implements IComponentConfigurator
    {
        public RegisterComponent(componentName: string, moduleName: string,  viewModelName: string, templateName: string)
        {
            var configuration = this.GetComponentConfiguration(moduleName,  viewModelName, templateName);
            ko.components.register(componentName, configuration);
        }

        public GetComponentConfiguration(moduleName: string,  viewModelName: string, templateName: string) : any
        {
            return {
                viewModel: {
                    moduleName: moduleName,
                    name: viewModelName
                },
                template: {
                    moduleName: moduleName,
                    name: templateName
                }
            };
        }
    }

这里的模块不是 js 模块,它是我们框架中的另一个概念。无论如何,所有注册都按预期进行,然后最终何时ko.applyBindings()被调用,并且页面上有一个自定义元素组件的实例,即:

<heading-menu></heading-menu>

没有任何控制台日志消息被吐出,并且标题菜单没有注入相关模板等。因此,忽略加载器的具体实现细节,只查看加载器和组件的注册以及元素使用情况应该这样工作?

从它的 KO 页面来看,我想我已经遵循了所有步骤,但无法弄清楚为什么它没有被解雇......

4

1 回答 1

0

我已经解决了这个问题,在 jsfiddle 中模拟了一切正常,因此在缩小场景中的不同之处时,我的 ko.applyBindings 被拆分为某些元素。结果发现添加的新组件并不完全在它们的范围内,因此只需将其添加到现有 applyBindings 目标的范围内。

于 2014-09-14T07:44:05.023 回答