Asp.net mvc 子JSON对象未定义，但其

我在页面源代码中有一个JSON对象数组，除了一个子对象（类别）之外，其他所有对象都可以工作

以下是cshtml中的代码：

      <script type="text/javascript">
var initialData = @Html.Raw(Json.Encode(ViewBag.OfferItems));
</script>

var initialData=@Html.Raw（Json.Encode（ViewBag.OfferItems））；

以下是生成的页面源：

       <script type="text/javascript">
var initialData = [{"Id":1,"Name":"Item1","ProductVariantLinks":[{"category":{"Id":2,"Name":"Basic Pizza","Products":null},"product":{"Id":1,"Name":"Margherita","Description":null,"ProductVariants":null},"productVariant":{"Id":1,"Name":"10 inch"}},{"category":{"Id":2,"Name":"Basic Pizza","Products":null},"product":{"Id":2,"Name":"Zeno","Description":null,"ProductVariants":null},"productVariant":{"Id":4,"Name":"8 inch"}}]},{"Id":2,"Name":"Item2","ProductVariantLinks":[]}];
</script>

var initialData=[{“Id”：1，“Name”：“Item1”，“ProductVariantLinks”：[{“category”：{“Id”：2，“Name”：“Basic Pizza”，“Products”：null}，“product”：{“Id”：1，“Name”：“Name”：“10 inch”}，{“category”：{“Id”：2，“Name”：“Basic Pizza”，“Products”：null}，“Products”：“{“Id”：2，“Name”：“Zeno”，“Description”：null，“ProductVariants”：null}，“productVariant”：{“Id”：4，“Name”：“8英寸”}}]}，{“Id”：2，“Name”：“Item2”，“ProductVariantLinks”：[]}]；

据我所知，该类别存在并包含属性，但它在IE的调试器中显示为未定义

有什么我遗漏的吗

另外，JSON是有效的

更新

我正在使用knockoutjs，在它执行ko.applybindings之前，category在inialdata中。我不确定它为什么会这样做，代码如下：

/// <reference path="jquery-1.5.1.js" />
/// <reference path="knockout-2.0.0.js" />
var ProductVariantLink = function() {
    var self = this;
    self.category = ko.observable();
    self.product = ko.observable();
    self.productVariant = ko.observable();

    // Whenever the category changes, reset the product selection
    self.category.subscribe(function() {
        self.product(undefined);
        self.productVariant(undefined);
    });
};

var OfferItem = function() {
    var self = this;
    self.Name = new String();
    self.ProductVariants = new Array();
};

var SpecialOfferItemModel = function (specialOfferItems) {
    var self = this;
    self.specialOfferItems = ko.observableArray(ko.utils.arrayMap(specialOfferItems, function (specialOfferItem) {
        return { Id: specialOfferItem.Id, Name: specialOfferItem.Name, ProductVariants: ko.observableArray(specialOfferItem.ProductVariantLinks) };
    }));

    self.addSpecialOfferItem = function () {
        self.specialOfferItems.push({
            Id: "",
            Name: "",
            ProductVariants: ko.observableArray()
        });
    };

    self.removeSpecialOfferItem = function (specialOfferItem) {
        self.specialOfferItems.remove(specialOfferItem);
    };

    self.addProductVariant = function (specialOfferItem) {
        specialOfferItem.ProductVariants.push(new ProductVariantLink());
    };

    self.removeProductVariant = function (ProductVariant) {
        $.each(self.specialOfferItems(), function () { this.ProductVariants.remove(ProductVariant) })
    };

    self.save = function () {
        var OfferItems = new Array();
        $.each(self.specialOfferItems(),
                function () {
                    var item = this;
                    var offer = new OfferItem();
                    offer.Name = item.Name;
                    $.each(item.ProductVariants(),
                    function () {
                        offer.ProductVariants.push(this.ProductVariant);
                    });
                    OfferItems.push(offer);
                });
                self.lastSavedJson(JSON.stringify(ko.toJS(self.specialOfferItems()), null, 2));
        return false;
    };

    self.lastSavedJson = ko.observable("");
};
var model = new SpecialOfferItemModel(initialData);
ko.applyBindings(model);
$(function () {
    $('#myForm').submit(function () {
        model.save();
    });
});



<table class="specialOfferItemsEditor">
        <tr>
            <th>
            </th>
            <th>
                Name
            </th>
            <th>
                ProductVariants
            </th>
        </tr>
        <tbody data-bind="foreach: specialOfferItems">
            <tr>
                <td>
                    <div>
                        <a href="#" data-bind="click: $root.removeSpecialOfferItem">Delete</a></div>
                </td>
                <td>
                    <input data-bind="value: Name" />
                </td>
                <td>
                    <table>
                        <tr>
                            <th>
                                Category
                            </th>
                            <th>
                                Product
                            </th>
                            <th>
                                ProductVariant
                            </th>
                        </tr>
                        <tbody data-bind="foreach: ProductVariants">
                            <tr>
                                <td>
                                    <select data-bind='options: ProductCategories, optionsText: "Name", optionsCaption: "Select...", value: category, uniqueName: true'>
                                    </select>
                                </td>
                                <td data-bind="with: category">
                                    <select data-bind='options: Products, optionsText: "Name", optionsCaption: "Select...", value: $parent.product, uniqueName: true' >
                                    </select>
                                </td>
                                <td data-bind="with: product">
                                    <select data-bind='options: ProductVariants, optionsText: "Name", optionsCaption: "Select...", value: $parent.ProductVariant, uniqueName: true'
                                        >
                                    </select>
                                </td>
                                <td>
                                    <a href='#' data-bind='click: $root.removeProductVariant'>Delete</a>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <a href='#' data-bind='click: $root.addProductVariant'>Add Product Variant</a>
                </td>
            </tr>
        </tbody>
    </table>

//
/// 
var ProductVariantLink=函数（）{
var self=这个；
self.category=ko.observable（）；
self.product=ko.observable（）；
self.productVariant=ko.observable（）；
//每当类别更改时，请重置产品选择
self.category.subscribe（函数（）{
自积（未定义）；
self.productVariant（未定义）；
});
};
var OfferItem=函数（）{
var self=这个；
self.Name=新字符串（）；
self.ProductVariants=新数组（）；
};
var SpecialOfferItemModel=函数（specialOfferItems）{
var self=这个；
self.specialOfferItems=ko.observableArray（ko.utils.arrayMap）（specialOfferItems，函数（specialOfferItem）{
返回{Id:specialOfferItem.Id，Name:specialOfferItem.Name，ProductVariants:ko.observeArray（specialOfferItem.productVariantLink）}；
}));
self.addSpecialOfferItem=函数（）{
自我特殊服务推送({
Id:“”，
姓名：“，
产品变体：ko.observearray（）
});
};
self.removeSpecialOfferItem=函数（specialOfferItem）{
self.specialOfferItems.remove（specialOfferItem）；
};
self.addProductVariant=函数（specialOfferItem）{
specialOfferItem.ProductVariants.push（新的ProductVariantLink（））；
};
self.removeProductVariant=函数（ProductVariant）{
$.each（self.specialOfferItems（），function（）{this.ProductVariants.remove（ProductVariant）}）
};
self.save=函数（）{
var OfferItems=新数组（）；
$.each（self.specialOfferItems（），
函数（）{
var项目=此；
var offer=新OfferItem（）；
offer.Name=item.Name；
$.each（item.ProductVariants（），
函数（）{
offer.ProductVariants.push（this.ProductVariant）；
});
推送（要约）；
});
self.lastSavedJson（JSON.stringify（ko.toJS（self.specialOfferItems（）），null，2））；
返回false；
};
self.lastSavedJson=ko.可观察（“”）；
};
var模型=新的SpecialOfferItemModel（初始数据）；
ko.应用绑定（模型）；
$（函数（）{
$（'#myForm'）。提交（函数（）{
model.save（）；
});
});
名称
产品变体
类别
产品
产品变体

JSON没有如您所期望的那样出现。我分配了您上面提供的JSON字符串，我的IE调试器能够找到“category”，没有任何问题

截图：

---

尝试

console.log

（或

alert

）

JSON.stringify（initialData）

您是否尝试过将var initialData编码为您提供的JSON字符串，而不是从ViewBag中提取它。OfferItems？实际生成的页面源代码是什么样子的？粘贴的源代码不能来自粘贴的源代码，因为它的结尾缺少分号…它确实有分号，但确实丢失了一些当我在编辑我的文章时，我是如何做到的。谢谢你，我还没有意识到knockoutjs中的ko.applyBindings是导致类别未定义的一行。