具有二维JSON数据结构的Kendo UI网格

Question

Kendo UI网格的大多数示例都显示一维数据网格。我得到的数据有2个维度。一个“名称”和一个子对象集合。集合中子对象的数量是随机的，应该动态扩展。即有时对象可能包含10个项目（尽管所有行的数量相同）。

我创建了一个我需要实现的示例：

+----------+--------+--------+-----+--------+-------+
|   Name   | Sweden | Norway | USA | Russia | China |
+----------+--------+--------+-----+--------+-------+
| Jesper   |     10 |      2 |  33 |      4 |     5 |
| Yngve    |      2 |     33 |   4 |      5 |    99 |
| Snoddas  |     10 |      2 |  33 |      4 |     5 |
| Herkules |     10 |      2 |  33 |      4 |     5 |
+----------+--------+--------+-----+--------+-------+

数据结构看起来像这样，都是伪数据，所以可能存在错别字：

var data = {
    resultContainer: [
        { name: "Jesper", countries: [{ nr: 2, c: "Sweden" }, { nr: 2, c: "Norway" }, { nr: 32, c: "USA" }, { nr: 34, c: "China" }] },
        { name: "Yngve", countries: [{ nr: 55, c: "Sweden" }, { nr: 1, c: "Norway" }, { nr: 23, c: "USA" }, { nr: 43, c: "China" }] },
        { name: "Herkules", countries: [{ nr: 55, c: "Sweden" }, { nr: 4, c: "Norway" }, { nr: 7, c: "USA" }, { nr: 7, c: "China" }] }
    ]
};

仅将其扔到Kendo UI中当然是行不通的：

$(".grid-container").kendoGrid({
    DataSource: {
        data: data.resultContainer
    },
    height: 550,
    groupable: true,
    sortable: true,
    pageable: {
        refresh: true,
        pageSizes: true,
        buttonCount: 5
    }
});

执行此操作将以正确的名称呈现第一列，并以对象[object Object]呈现第二列。

实现此目标的最佳方法是什么？我必须更改收到的数据结构吗？