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
3 answers
solution1
1 2016-12-21 07:02:16
The issue was on my side , because my ng-repeat was outside of my ng-controller. Check, it may help someone.
solution2
0 2015-10-29 11:27:51
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>
solution3
0 2015-10-29 12:19:40
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? :-)
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.