Javascript Knockout JS：使用预定义对象构建viewModel

我有一个很大的XML文件（转换成JSON），它由具有相同结构的多个重复部分组成。每个部分都有一组结构相同的属性（XML到JSON的转换将所有属性移动到名为

myAttributes

）的对象中），以及特定于部分的属性。我的目标是能够读取现有的XML并生成新的XML

我尝试使用mapping插件，它只允许我读取XML，不允许我生成XML，而且对象元素之间存在多个相互依赖关系

我认为解决这个问题的最佳方法是预先定义一组匹配XML小部分的对象。当组装在一起时，这些对象将能够生成我需要的XML结构。通过这种方式，我可以循环使用从XML生成的JSON数组，用适当的数据填充预定义的对象，并将它们附加到我的viewModel中（比如10个警报、3个动作、6个度量分组等）。从预定义对象生成XML也应该很容易

然而，由于我对JavaScrip和KnockoutJS都缺乏经验，我很难理解这一点

// Main Top Level Management Module Object
function ManagementModule(data) {
    this.myAttributes = new Object();
    this.myAttributes.Name = ko.observable(data.Name);
    this.myAttributes.IsActive = ko.observable(data.IsActive);
    this.myAttributes.DescriptionContentType = ko.observable(data.DescriptionContentType);
    this.myAttributes.Description = ko.observable(data.Description);
    // There are other object specific properties, but I omitted them for now
}

// New Alert Object. It will be deep in the hierarchy of the main top level object
// but for now i will make it top level for test purposes.
function Alert(data) {
    this.myAttributes = new Object();
    this.myAttributes.Name = ko.observable(data.Name);
    this.myAttributes.IsActive = ko.observable(data.IsActive);
    this.myAttributes.DescriptionContentType = ko.observable(data.DescriptionContentType);
    this.myAttributes.Description = ko.observable(data.Description);
    // There are other object specific properties, but I omitted them for now
}

// View Model
function myModel() {
    var self = this;
    self.ManagementModule = ko.observableArray();
    self.Alerts = ko.observableArray();
};
var myViewModel = new myModel();

然后我循环使用JSON并尝试将内容附加到视图模型中。。。这就是事情不正常的地方。也许是因为我误解了对象

$.getJSON("/getXML", function (data) {

    for (var key in data) {
        // Do something here
    }

    // This seems to work OK. There is only 1 so, I just
    // set it.
    myViewModel.ManagementModule(data['myAttributes']);

    for (var i = 0; i < data['DataGroups']['DataGroup'].length; i++) {
        var current = data['DataGroups']['DataGroup'][i];
        if(current['AlertBase']) {

             var AlertBase = current['AlertBase'];

             // There are multiple Alarts
             for (var i = 0; i < AlertBase.length; i++) {
                     myViewModel.Alerts.push(Alert(AlertBase[i].myAttributes));
             }
        }

    };
    ko.applyBindings(myViewModel);

});

我想我解决了

myViewModel = new ManagementModule(data['myAttributes']);

myViewModel.Alerts = ko.observableArray();
myViewModel.Alerts.push(new Alert(AlertBase[i].myAttributes));


<div data-bind="text: myAttributes.Name"></div><br />
<div data-bind="foreach: Alerts()">
    <div data-bind="text: myAttributes.Name"></div>
</div>

myViewModel=newmanagementmodule（数据['myAttributes']）；
myViewModel.Alerts=ko.observableArray（）；
myViewModel.Alerts.push（新警报（AlertBase[i].myAttributes））；

首先，您引用的是observableArrays，就好像它们是我们可以观察到的一样。您需要在其中的某个位置使用data bind=foreach:Alarms（）

好：看看这个JSFIDLE是否能帮助您：

---

请注意，我将属性设置为camelCased（即managementModule）。

首先，您引用的是ObservableArray，就好像它们是我们可以观察到的一样。您需要在其中的某个位置使用data bind=foreach:Alarms（）

好：看看这个JSFIDLE是否能帮助您：

---

请注意，我将属性设置为camelCased（即管理模块）。

谢谢。意识到在回家的路上也在车里更新了这个问题。尽管如此，还是没有达到预期效果。谢谢史蒂夫。我让它工作，但真的很感谢你们花时间来修复我的代码并给出解决方案。标记为已解决。再次感谢。至于变量，我自己更喜欢camelCase，但它们来自XML，首字母大写，所以我必须保持这种方式。谢谢。意识到在回家的路上也在车里更新了这个问题。尽管如此，还是没有达到预期效果。谢谢史蒂夫。我让它工作，但真的很感谢你们花时间来修复我的代码并给出解决方案。标记为已解决。再次感谢。至于变量，我自己更喜欢camelCase，但它们来自XML，首字母大写，所以我必须保持这种方式。

<div data-bind="text: myAttributes.Name"></div>

<div data-bind="foreach: Alerts()">
    <div data-bind="text: myAttributes.Name"></div>
</div>

myViewModel = new ManagementModule(data['myAttributes']);

myViewModel.Alerts = ko.observableArray();
myViewModel.Alerts.push(new Alert(AlertBase[i].myAttributes));


<div data-bind="text: myAttributes.Name"></div><br />
<div data-bind="foreach: Alerts()">
    <div data-bind="text: myAttributes.Name"></div>
</div>