0

我Knockout.js对视图模型的创建相对较新并且有一个问题。

我目前正在做的是：

viewModel = {

                Menu: ko.observableArray(ko.utils.parseJson(data)),

                editMenu: function (menu) {
                    ko.applyBindings(menu, document.getElementById("MenuCategories"));
                    $("#MenuCategories").bPopup();
                }

有不止一个功能，但尽量保持简短。

我想要做的是使用映射插件，因为我使用的 json 数据包含对象数组，每个对象包含一个数组，并且该数组中的每个对象也包含一个数组。JSON 的样子：

[
  {
    "Id": 1,
    "Name": "Test 5",
    "Description": "Testing menu",
    "BeveragesMenu": false,
    "Active": true,
    "Categories": [
      {
        "Id": 1,
        "Name": "Test 1",
        "Active": true,
        "MenuItems": [
        {
          "Id": 1,
          "Name": "Food",
          "Description": "2 Eggs and Bread",
          "Price": 50,
          "DateBased": false,
          "PriceOnRequest": false,
          "DateFrom": null,
          "DateTo": null,
          "Active": true
        }
      ]
    },
    {
      "Id": 2,
      "Name": "Test 2",
      "Active": true,
      "MenuItems": [
        ]
     },
     {
       "Id": 1004,
       "Name": "test",
       "Active": true,
       "MenuItems": [
        ]
     },
     {
       "Id": 1005,
       "Name": "Test 4",
       "Active": true,
       "MenuItems": [
         ]
     }
   ]
 },
 {
   "Id": 92,
   "Name": "Test 4",
   "Description": "",
   "BeveragesMenu": false,
   "Active": false,
   "Categories": [
   {
     "Id": 1006,
     "Name": "Test 1",
     "Active": true,
     "MenuItems": [
     {
       "Name": "Test",
       "Description": "",
       "Price": "",
       "DateBased": false,
       "PriceOnRequest": false
      }
    ]
  }
]
},
{
"Id": 93,
"Name": "Test 6",
"Description": "",
"BeveragesMenu": false,
"Active": false,
"Categories": [

]
},
{
"Id": 94,
"Name": "Test 9",
"Description": "",
"BeveragesMenu": false,
"Active": false,
"Categories": [

]
},
{
  "Id": 95,
  "Name": "Test 20]",
  "Description": "",
  "BeveragesMenu": false,
  "Active": false,
  "Categories": [
  {
    "Id": 4,
    "Name": "Test 6666",
    "Active": true,
    "MenuItems": [

    ]
  }
]
},
{
  "Id": 96,
  "Name": "Test 444",
  "Description": "",
  "BeveragesMenu": false,
  "Active": false,
  "Categories": [
  {
    "Id": 3,
    "Name": "Test 555",
    "Active": true,
    "MenuItems": [

    ]
  },
  {
    "Id": 5,
    "Name": "Test 6666",
    "Active": true,
    "MenuItems": [

    ]
  },
  {
    "Id": 1003,
    "Name": "test 777",
    "Active": true,
    "MenuItems": [

    ]
  }
]
}
]

很抱歉粘贴了长的 JSON 代码。

所以现在我在使用对象等更新数组中对象的某些部分时遇到了问题。

所以我教导说映射插件可能会解决我的问题，因为它将所有数组都创建为可观察的，我假设这是我的问题。

所以我尝试了：

viewModel = {
                Menu: ko.mapping.fromJSON(ko.utils.parseJson(data)),
                //Menu: ko.observableArray(ko.utils.parseJson(data)),

                editMenu: function (menu) {
                    ko.applyBindings(menu, document.getElementById("MenuCategories"));
                    $("#MenuCategories").bPopup();
                },

但是后来我的绑定都没有工作，我似乎找不到原因，任何关于这个问题的建议或提示将不胜感激。

这是我尝试过的所有事情的小提琴。http://jsfiddle.net/armandvdwalt/pjJc2/3/

谢谢

4

1 回答 1

0

试试这个小提琴，我切换了资源的顺序。您在敲除之前引用了映射插件，这会生成关于无法识别“ko”的脚本错误。此外，在使用 fromJSON 时不需要使用 ko.utils.parseJson，因为 fromJSON 需要 JSON 作为参数。

于 2012-07-10T12:52:55.947 回答