binding - knockoutjs 'foreach' 绑定无法获取定义为类的属性？

Question

我是使用 Knockoutjs 的新手

我有一个 viewModel 定义如下：

// this is a subclass
var Order = {
        selfdata: {
            id : ko.observable(),
            goodsName : ko.observable(''),
            color : ko.observable(''),
            size : ko.observable(''),
            count: ko.observable(''),
            orderDate: ko.observable(''),
            remarks: ko.observable('')
        },
    }
   // this is a viewModel
   function ShoppingCar() {
        var self = this;
        self.orders = ko.observableArray([]);
        self.show = function (msg) {
            return msg.id;
        }

        //init
        $.get('/Shopping/GetOrders', null, function (data) {
            var items = $.map(data, function (item) { return Order.init(item) });// I write a init function to init order
            self.orders(items);
        });
    }
//then I use Knockoutjs foreach binding as below:
<ul data-role="listview" data-theme="e" data-divider-theme="d">
 <!-- ko foreach: orders -->
     <li data-role="list-divider" data-bind="text: $data.selfdata.id">//!I get null value here</li>

     <li><a href="#">
        <h3 data-bind="text: $data.isValid"></h3>
        <p><strong data-bind="text: $data.selfdata.color">//! here has null value too!</strong></p>
        <p class="ui-li-aside"><strong>12:14</strong>PM</p>
        </a></li>
 <!-- /ko --> 

所以，我的问题是，如何order.selfdata在 ko 的 foreach 中显示？

Answer 1

你试过把：

selfdata.id

此外，您是否已调试并确保您实际上正确填充了 Orders 对象？

Answer 2

你需要关闭你的强标签。它被评论抹去

<p><strong data-bind="text: $data.selfdata.color">//! here has null value too!</strong></p>

应该

<p><strong data-bind="text: $data.selfdata.color"></strong></p>

您也不需要 $data。selfdata.color 应该可以正常工作，假设数据实际上被正确地传递到 observable 中。

如果修复注释和删除 $data 不起作用，我将使用浏览器调试器检查并查看可观察对象中实际包含哪些数据。