AngularJS Ng-repeat with array

Question

我有表并尝试使用ng-repeat渲染表格行。

情况是我有一张发票，可能附有或没有附上多个发票详情。数据在对象中返回，其中一个属性是数组。所以，我创建了我的表并使用数组作为模型使用ng-repeat。在某种程度上它可以工作，因为三个表行被渲染出来，但描述仍然是字段空白。

由于

我看了here

HTML：

<tbody>
    <tr style="cursor:pointer" ng-repeat="details in vm.orders.componetGrid ">                    
        <td ng-bind="details.componetGrid.componentDescription"></td>
    </tr>
</tbody>

JS

function loadOrder(invoiceNumber) {
    return orderService.getOrderById(invoiceNumber)
        .then(function (result) {
            vm.orders = result.data;                
        }, function (err) {
            console.log("error returned");
        });
}

数据样本

Answer 1

details被绑定为componetGrid的每个成员，所以

                <td ng-bind="details.componetGrid.componentDescription"></td>

应该是

                <td ng-bind="details.componentDescription"></td>

代替

Answer 2

您对componentDescription的引用是错误的。这应该有效：

<tbody>
    <tr style="cursor:pointer" ng-repeat="details in vm.orders.componetGrid ">                    
        <td ng-bind="details.componentDescription"></td>
    </tr>
</tbody>

Answer 3

从您在代码段中提供的数据看起来，componentgrid就是一个数组。

现在在ng-repeat details in vm.orders.componetGrid中表示详细信息是一个组件网格对象。

所以你不应该说details.componentgrid.componentDescription

而应该是details.componentDescription