knockout.js - knockout.js 将不同的项目绑定到不同的 li

Question

我有一个 viewModel，其中包含不同索引的多个对象

[0]{id=1,name="adventure",description="abc"}

[1]{id=2,name="urban",description="def"}

[2]{id=3,name="romantic",description="ghi"}

我使用淘汰赛的映射插件得到了这个视图模型，即

var categoriesViewModel = ko.mapping.fromJS(data);

现在我有一个带有 3 个 li 标签的 html，如下所示。

<section class="categories">

                <ul class="categories-list">
                    <li class="urban"><a  href="javascript:;"><span>urban living</span></a></li>
                    <li class="adventure"><a href="javascript:;"><span>adventure</span></a></li>
                    <li class="romantic"><a href="javascript:;"><span>romantic</span></a></li>
                </ul>

如何将不同的对象绑定到不同的 li。

例如，第一个 li 应该与 categoriesViewModel 中的第二个对象绑定，即 categoriesViewModel ()[1] 。

我不想像 [1]、[2] 等对索引进行硬编码。我想从 categoriesViewModel 获取相关对象并绑定它。

期待快速帮助。

Answer 1

您可以使用 foreach 循环执行此操作：

<ul class="categories-list" data-bind="foreach: categories">
    <li data-bind="attr: {class: name}"><span data-bind="text: desc"></span></li>
</ul>