Question

我试图绑定一个选择/列表框，其中有3个级别的数据，我希望输出如下所示

List<Product> _list = [];

这就是我要绑定的方式

<select>
    <optgroup label="Root 1">
        <optgroup label="Group 1"> 
            <option>Option 1</option>
            <option>Option 2</option>
            <option>Option 3</option>
        </optgroup>
    </optgroup>
    <optgroup label="Root 2">
        <optgroup label="Group 2">
            <option>Option A</option>
            <option>Option B</option>
            <option>Option C</option>
        </optgroup>
    </optgroup>
</select>

我收到以下错误

消息：无法处理绑定“ foreach：function（）{return terms}” 消息：未定义条款

条款在groupTerms上存在

Answer 1

从我看到的内容来看，您的HTML循环语法无效，而且：嵌套的optgroup理论上是错误的，并且在渲染dom时无论如何都会变平。这个应该可以工作：

<div id="termdata">
    <select id="termsList" name="Term" data-bind="foreach: allterms">
      <optgroup data-bind="attr: {label: name}"></optgroup>
      <!-- ko foreach: { data: termRoot, as: 'root' } -->
        <optgroup data-bind="attr: {label: root.name},
          foreach: { data: root.termGroup[0].terms, as: 'group' }">
          <option data-bind="text: group.name">ds</option>
        </optgroup>
      <!-- /ko -->
    </select>
</div>

请注意，termGroup是一个数组，因此从理论上讲，您也应该对其进行循环（不过，我刚刚使用了第一个索引-root.termGroup[0].terms），而您试图显示{{1} }的语法中，因为我所说的termGroup是一个数组，所以没有这样的事情。

淘汰赛3级optgroup绑定

1 个答案: