Simple Angular.js: ng-repeat not showing data

Question

i am trying to get a simple angular.js script working, just getting information from a mysql db and show them via ng-repeat. The site is just blank, no error or something like that ... so i suggest i got a logical problem here.

controller:

var app = angular.module('ISPapp', []);
app.controller('artikelController', function($scope, $http) {
	
	getArtikel();
	
	function getArtikel(){
		$http.post("ajax/get_artikel.php").success(function(data){
		$scope.artikel_entrys = data;
		});
	};

});

Output:

<table ng-controller="artikelController">

<thead><tr><th>ID</th><th>Artikelnr</th><th>Kit</th><th>Min Bestand</th><th>Beschreibung</th>< tr></thead>

<tbody>

<tr ng-repeat="row in artikel_entrys">
	<td>{{row.id}}</td>
	<td>{{row.artikelnr}}</td>
	<td> Test </td>
	<td>{{row.min_bestand}}</td>
	<td>{{row.beschreibung}}</td>
</tr>

</tbody> </table>

Index:

<!DOCTYPE html>

<html ng-app="ISPapp">

<head>
	<script type="text/javascript" src="js/angular.min.js"></script>
	<script type="text/javascript" src="js/app.js"></script>
</head>

<body ng-controller="artikelController">

<div ng-include src="app/artikel.html"></div>

</body>

</html>

The json object from PHP is fine.

Thanks for your help in advance!

gz Pad

It should work..just remove ng-controller="artikelController" from the table tag, two stop controller initialization twice — Pankaj Parkar
– Pankaj Parkar, Commented Oct 29, 2015 at 11:19
Not as simple as the space in < tr> ruining it? '</th>< tr></thead>' — sch
– sch, Commented Oct 29, 2015 at 11:22
ng-repeat works on an array not on an json object, that's the problem — user84
– user84, Commented Oct 29, 2015 at 11:24

Deepak S · Accepted Answer · 2017-08-23 04:18:39Z

1

The issue was on my side , because my ng-repeat was outside of my ng-controller. Check, it may help someone.

edited Aug 23, 2017 at 4:18

Deepak S

1,5943 gold badges16 silver badges37 bronze badges

answered Dec 21, 2016 at 7:02

NoloMokgosi

1,72816 silver badges10 bronze badges

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

Comments

user84 · Accepted Answer · 2015-10-29 11:34:08Z

0

The way that you are using ng-repeat is used for an array.

To move through a JSON object you have to go other way around

<div ng-repeat="(key, value) in myObj"> ... </div>

edited Oct 29, 2015 at 11:34

answered Oct 29, 2015 at 11:27

user84

9151 gold badge15 silver badges46 bronze badges

3 Comments

Pad Over a year ago

i dont get why... Here is my Json object: [{"id":"1","artikelnr":"test","kit":"N","min_bestand":"5","beschreibung":"Das ist ein Testartikel"},{"id":"2","artikelnr":"Test2","kit":"J","min_bestand":"1","beschreibung":"Das ist der zweite Testartikel"}] --- why can i not just go through it ? in every tutorial for angular it is used this way...

user84 Over a year ago

For simple test, can you put the table inside the html instead of inclduing it in other html? remove atikelcontroller snd just leave it in table tag. May be because you are having a new view, the controller isnt working on this view

Pad Over a year ago

seems right, i tried it with the code above and it worked, i inserted it as view and it wont work!

Pad · Accepted Answer · 2015-10-29 12:19:40Z

i tried a few other things and now it is working with this code:

Index HTML

<!doctype html>
<html ng-app>
<head>
<title>ISP Artikel</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
<script src="script.js"></script>
</head>

<body>
<div ng-controller="getArtikel">

<table>
<thead><tr><th>ID</th><th>Artikel Nr</th><th>Beschreibung</th></tr></thead>
<tbody>
<tr ng-repeat="row in artikel_entrys"><td>{{row.id}}</td><td>{{ row.artikelnr }}</td><td>{{row.beschreibung}}</td></tr>
</tbody>
</tfoot></tfoot>
</table>

</div>
</body>

And this Javascript snippet

function getArtikel($scope, $http) {
    // this is where the JSON from api.php is consumed
    $http.get('ajax/get_artikel.php').
        success(function(data) {
            // here the data from the api is assigned to a variable named users
            $scope.artikel_entrys = data;
        });
}

It is the same PHP Api behind that than before. Same Json Object...

I am glad that it works now but can anyone explain me what i have done wrong before? :-)

Collectives™ on Stack Overflow

Simple Angular.js: ng-repeat not showing data

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related