敲除:在列中显示数组类别

Question

我已经采取了一个基本的例子，在模板从淘金术士的网站。我把它用于学习目的，但我需要将它应用到现有的项目中。下面是一个基本的小提琴：

http://jsfiddle.net/hRm22/数组如下：

var viewModel = {
    seasons: ko.observableArray([{
        name: 'Spring',
        months: ['March', 'April', 'May']
    }, {
        name: 'Summer',
        months: ['June', 'July', 'August']
    }, {
        name: 'Autumn',
        months: ['September', 'October', 'November']
    }, {
        name: 'Winter',
        months: ['December', 'January', 'February']
    }])
};
ko.applyBindings(viewModel);

我想做的是一排排地展示季节。栏目标题:春、夏、秋、冬；然后按各自的月份分别列。这看起来相当简单，但我无法完全理解那种格式。

我应该继续使用表格，还是最好用div代替？

Answer 1

如果你没有桌子的话就容易多了。这里并不需要使用模板。不过，你可以把它做个模板。

<!-- ko foreach: seasons -->
<ul class="column">
    <li data-bind="text: name" class="header"></li>
    <!-- ko foreach: months -->
    <li data-bind="text: $data"></li>
    <!-- /ko -->
</ul>
<!-- /ko -->

.column {
    float: left;
    list-style-type: none;
}

.header {
    font-weight: bold
}

http://jsfiddle.net/94hpU/