AngularJS get data from webapi and store in table

Question

I created a rest web api and using AngularJS, I want to receive those json data and store them in a table. I am new to AngularJS. I was able to get all the json data but I want to split them up into each row. I am not sure if I am doing to correctly or not but here is my code:

index.html

<!DOCTYPE html>
<html ng-app="demoApp">
<head>
<meta charset="UTF-8">
<title>Angular</title>
<script src="lib/angular.js"></script>
<script src="angularDemo.js"></script>
</head>
<body>
    <div ng-controller="demoController">
        <table>
            <tr>
                <th>Id</th>
                <th>Question</th>
            </tr>
            <tr ng-repeat=" quiz values">
                <td>{{result.id}}</td> <!-- Does not get any value-->
                <td>{{result.question}}</td> <!-- Does not get any value-->
            </tr>
        </table>
        <h1>{{result}}</h1> <!-- gets all the json data -->
    </div>
</body>
</html>

js

var app = angular.module("demoApp", []);

app.controller("demoController", function($scope, $http) {
    $http.get("http://localhost:8080/quiz/webapi/quiz")
    .then(function(response) {
        $scope.result = response.data;
    });
});

What is this <tr ng-repeat=" quiz values">?

Hadi
– Hadi

2017-08-16 15:21:41 +00:00
Commented Aug 16, 2017 at 15:21 — Hadi
– Hadi, Commented Aug 16, 2017 at 15:21

Hadi · Accepted Answer · 2017-08-16 15:26:46Z

1

Your ng-repeat is not good,

If i understand your array of results is in $scope.result, so you have to do this kind of ng-repeat :

<tr ng-repeat="row in result">
   <td>{{row.id}}</td> 
   <td>{{row.question}}</td> 
</tr>

edited Aug 16, 2017 at 15:26

Hadi

17.3k4 gold badges41 silver badges63 bronze badges

answered Aug 16, 2017 at 15:22

Drakkin

90812 silver badges29 bronze badges

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

1 Comment

bubbles2189 Over a year ago

Oh ok I thought after ng-repeat="", it is supposed to be some kind of comments. Now I see, thank you

Collectives™ on Stack Overflow

AngularJS get data from webapi and store in table

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related