javascript - ng grid：有没有办法为每条记录呈现两行？（或行后的 HTML？）

Question

我正在使用 ng-grid，我希望有第二行可以选择性地显示在 ng-grid 中，其中包含与该行相关的较小的网格/值列表。

这是我要做什么的粗略 plunkr 模型：

http://plnkr.co/edit/6Wgpk7jxJLDY7wv023Ne?p=preview

有没有办法用 ng-grid 来完成这个？

Answer 1

听起来你只是在关注主细节：http ://angular-ui.github.io/ng-grid/#/masterdetail

请注意，您不需要在主网格中显示所有列。

因此，如果您的数据如下所示：

[
  {name: "John Doe", street: "123 Main St.", phone: "(555)555-0199", purchases: [] },
  {name: "Jane Doe", street: "123 Main St.", phone: "(555)555-0198", purchases: [{item: "hat", price: "12"}, {item: "yellow shoes", price: "125"}]}
];

您只能在网格中显示前三个：

 $scope.colDefs = [
    {field  : "name"},
    {field : "street"},
    {field  : "phone"}
    ];

并通过将其添加到 gridoptions 来显示其他列

selectedItems: $scope.mySelections

最后，要显示其他列，您可以使用 ng-repeat 指令

<div class="footer" ng-repeat="item in mySelections">
    <span class=header>Item</span>
    <span class=header>Price</span>
    <p ng-repeat="purchase in item.purchases">
          <span>{{purchase.item}}</span>
          <span>{{purchase.price}}</span>
    </p>
    </div>

我已经在这个 plunker 中解决了这个问题：http: //plnkr.co/iGz1RjOILjP2VZxEt1ny