KnockoutJS：嵌套 ko.observableArray答案

【问题标题】：KnockoutJS: nesting ko.observableArrayKnockoutJS：嵌套 ko.observableArray
【发布时间】：2011-08-26 15:24:53
【问题描述】：

我正在尝试确定构建应用程序的最佳方式，但我有点困惑。我希望我的基本结构是这样的：

banners (ko.observableArray)
   - banner 
       - previewURLs (ko.observableArray)

我创建“横幅”的方式是将其定义为如下类：

// define a "banner" class
function banner(inventory, name, advertiser, artType, artSize, previewURLs) {
    return {
        inventory : ko.observable(inventory),
        name : ko.observable(name),
        advertiser : ko.observable(advertiser),
        artType : ko.observable(artType),
        artSize : ko.observable(artSize),
        previewURLs : ko.observableArray(previewURLs),

        // track if our banner is selected
        isSelected : ko.observable(false),  
    };
};

这是正确的方法吗？我不确定如何在横幅本身中“嵌套”“previewURLs”数组。我在上面尝试过，但似乎不起作用。

然后在我的 viewModel 中：

var viewModel = {
    selectAll: ko.observable(false),
    banners : ko.observableArray([
        new banner("network", "Banner #1", "Target and Friends", "3rd Party", "300x250"), 
        new banner("oo", "Banner #2", "IBM", "Flash", "720x90")
    ]),
    previewURLs : ko.observableArray([
        new previewURL("test site #1", "http://www.google.com"),
        new previewURL("test site #2", "http://www.google.com")
    ]),
    addBanner : function() {
        this.banners.push(new banner("network", "Banner"));
    }
};

总的来说，我只是对如何构建它感到困惑。我以前从未使用过任何 MVVM 或 MVC 结构，所以这对我来说是全新的。

我的想法是，我可以通过执行类似的操作来访问我的横幅 previewURLs banners.banner.previewURL(1)，但我的想法可能有点偏离。

我可以在新横幅的定义中定义一个新的 previewURL 吗？

【问题讨论】：

标签： arrays knockout.js

【解决方案1】：

我认为你的想法是对的。但是，在创建 viewModel 对象之前，无法访问 viewModel.previewURLs。您可能希望将您的 previewURLs 传递给横幅构造函数或将您的 previewURLs 存储在先前定义的变量中，该变量可以在横幅构造函数中访问。

在此处传入 previewURL 的示例：http://jsfiddle.net/rniemeyer/bZhCk/

【讨论】：