AngularJS ng-repeat not displaying data

Question

I have an array inside of my controller that I'm tried to iterate into a table inside of my view template. Inside of the console, I can see the array objects but inside my table, I only see the rows without the data being displayed.

HTML Template:

<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>

Controller:

    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
        }
    ];
}]);

How the table looks:

This is what I can see inside of the console:

Maybe <td>{{item.qty}}</td> instead of items

The fourth bird
– The fourth bird

2018-11-26 21:27:12 +00:00
Commented Nov 26, 2018 at 21:27 — The fourth bird
– The fourth bird, Commented Nov 26, 2018 at 21:27

The fourth bird · Accepted Answer · 2018-11-26 21:46:12Z

1

You are looping through items: item in items.

Try item.qty and item.item instead:

<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>

answered Nov 26, 2018 at 21:46

The fourth bird

165k16 gold badges61 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJS ng-repeat not displaying data

How the table looks:

This is what I can see inside of the console:

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

How the table looks:

This is what I can see inside of the console:

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related