javascript – 大型KnockoutJS应用程序架构

我喜欢KnockoutJS,但一直在努力找出构建大规模Javascript应用程序的最佳方式。

现在,我正在处理代码的方式是通过使用根视图模型构建,通常从母版页级开始,然后扩展。我只在主视图上使用ko.applyBindings()。这是我有的示例代码:

var companyNamespace = {};

// Master page. (a.k.a _Layout.cshtml)
(function(masterModule, $, ko, window, document, undefined) {
    var private = "test";

    masterModule.somePublicMethod = function() {};
    masterModule.viewModel = function() {
        this.stuff = ko.observable();
    };
}(companyNamespace.masterModule = companyNamespace.masterModule || {}, jQuery, ko, window, document));

// Index.cshtml.
(function(subModule, $, ko, window, document, undefined) {
    var private = "test";

    subModule.somePublicMethod = function() {};
    subModule.viewModel = function() {
        this.stuff = ko.observable();
    };

    $(document).ready(function() {
        ko.applyBindings(companyNamespace.masterModule);
    });
}(companyNamespace.masterModule.subModule = companyNamespace.masterModule.subModule || {}, jQuery, ko, window, document));

我只是担心,因为这是一个树结构,如果我需要插入一个双主页或类似的东西,这将是非常麻烦重新确定。

思考?

编辑

我知道您可以将绑定应用于单独的元素来更改绑定的范围,但是如果我有嵌套视图模型怎么办?

我喜欢使用原型继承来设置我的视图模型。像你一样,我有一个“主”视图模型。该视图模型包含其他视图模型或可观察数据视图模型的实例,您可以在其中使用标记中的“foreach”和“绑定”绑定。在“foreach”和“with”绑定之间,您可以使用$ data,$ parent,$ parents和$ root绑定上下文来引用您的父视图模型。

以下是KO文档中的相关文章。

foreach binding

with binding

binding context

如果你想我可以扔在一起的小提琴。让我知道。

http://stackoverflow.com/questions/10588693/large-scale-knockoutjs-application-architecture

本站文章除注明转载外,均为本站原创或编译
转载请明显位置注明出处:javascript – 大型KnockoutJS应用程序架构