AngularJS Ng-重复数组

Question

我有 table 并尝试使用 ng-repeat 渲染出 table 行。

情况是我有一张发票，其中可能附加也可能不附加多个发票详细信息。数据在一个对象中返回，其中一个属性是一个数组。因此，我创建了我的 table 并使用 ng-repeat 使用数组作为模型。在某种程度上它是有效的，因为呈现了三个 table 行，但描述字段仍为空白。

谢谢

我看了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

您对组件描述的引用是错误的。这应该有效：

<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 对象。

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

应该是details.componentDescription

AngularJS Ng-重复数组

AngularJS Ng-repeat with array

angularjs

ng-repeat

angularjs-ng-repeat