AngularJS ng-repeat不显示数据

Question

我的控制器内部有一个数组，试图将其迭代到视图模板内部的表中。在控制台内部，我可以看到数组对象，但是在表内部，我只能看到没有显示数据的行。

HTML模板：

<div class="availability-list-table" ng-controller="InventoryController">
<table class="table availability-table">
    <tbody>
    <tr ng-repeat="item in items">
        <td>{{items.qty}}</td>
        <td>{{items.item}}</td>
    </tr>
    </tbody>
</table>

控制器：

    app.controller('InventoryController', ['$scope', function($scope) {

    $scope.items = [
        {
            item: 'Blue Moon Pint',
            qty: 50,
        },
        {
            item: 'Bud Light Pint',
            qty: 50,
        },
        {
            item: 'Sprite',
            qty: 30,
        },
        {
            item: 'Coke',
            qty: 100
        }
    ];
}]);

表的外观：

这是我在控制台内看到的内容：

Answer 1

您正在浏览以下项目：item in items。

改为尝试item.qty和item.item：

<div class="availability-list-table" ng-controller="InventoryController">
<table class="table availability-table">
    <tbody>
    <tr ng-repeat="item in items">
        <td>{{item.qty}}</td>
        <td>{{item.item}}</td>
    </tr>
    </tbody>
</table>