Question

我有对象模型，格式如下，

models:
   [
      0: {
         [functions]: ,
         __proto__: { },
         Main: "Sample",
         sub: [
            0: " Sub1",
            1: " Sub2",
            2: " sub3",
            3: " sub4",
            4: " sub5",
            5: " sub6",
            6: " sub7",
            7: " sub8",
            length: 8
         ]
      },
      1: { },
      2: { },

我列出了对象的前三个元素作为样本。还阐述了第一个要素。我想在下面列出这个。

Main 1
 sub details
Main 2
 sub details

我试过了，我无法弄清楚为什么我的数据绑定无效。以下代码未在屏幕中显示任何内容。

            <td>
                <ul class="tree">
                    <li data-bind="foreach: models" >
                        <span data-bind="text: $data[$index].main"></span>
                        <ul data-bind="foreach: subDetails in models.sub">
                            <li><span data-bind="text: $data[$index].sub"></span></li>
                        </ul>
                    </li>
                </ul>
            </td>

请在这里查看我的fiddle。任何帮助将不胜感激。

Answer 1

你的 fiddle存在很多问题。这是一个清单 -

您已撰写ko.applybindigs应该是ko.applyBindings
model应该是viewModel的一部分，因此您需要将该变量附加到viewModel。像var self = this; self.model = []...一样。将它声明为私有var不会将其暴露给敲除绑定，因此无效。
进入foreach绑定后，您不需要$index来访问数组内部的对象，只需按名称访问它们即可。因此<span data-bind="text: $data[$index].Main"></span>被<span data-bind="text: Main"></span>
你有另一个foreach嵌套在外面的那个，你也使用了$index访问者，这是非常必要的。添加到<ul data-bind="foreach: subdetails in model.sub">的内容可以轻松替换为<ul data-bind="foreach: Sub">（另请注意sub中应该是Sub的错字

更正小提琴here

淘汰赛Js：foreachBinding

1 个答案: