html - AngularJS - 在 ng-grids cellTemplate 内部重复 ng-repeat

Question

给定以下数据集:

{
    "url": "www",
    "words": [
        {
            "name": "fish",
            "count": 1
        },
        {
            "name": "pig",
            "count": 60
        }
    ]
},
{
    "url": "www",
    "words": [
        {
            "name": "zebra",
            "count": 0
        },
        {
            "name": "cat",
            "count": 12
        }
    ]
},
{
    "url": "www",
    "words": [
        {
            "name": "dog",
            "count": 0
        },
        {
            "name": "antilope",
            "count": 2
        }
    ]
}

我想创建一个看起来像这样的网格:

   URL     Words:Count
--------|--------------
|       |   fish:1    |
| www   |   pig:60    |

等...

在我的 Controller 中，我尝试了以下配置:

$scope.gridOptions = { 
        data: 'data',
        columnDefs: [
        {field:'url', displayName:'URL'}, 
        {displayName:'Words:Count', cellTemplate: '<div class="ngCellText"><div ng-repeat="word in row.entity.words">{{word.name + ":" + word.count}}</div>'}
  ]
}

但我得到的只是第一个词:count，而不是整个集合。

我试过查看文档，但找不到任何东西，

我错过了什么？

Answer 1

你检查过网格的高度了吗？这是 plnkr与您的代码及其工作。

样式.css

.gridStyle {
    border: 1px solid rgb(212,212,212);
    width: 400px; 
    height: 300px;
}

JavaScript:

...

$scope.gridOptions = {
...

rowHeight: 80 // height of each row

...
};

...

index.html

<div class="gridStyle" ng-grid="gridOptions"></div>