This question already has an answer here:
I am trying to bind json data to angular module. Following is my code.
<script>
var app = angular.module('myApp',[]);
app.controller('myCtrl',function($scope,$http){
$http.get("list.php").then(function(response) {
$scope.myData = response.data.records;
});
});
</script>
<div class="col-md-12"><!--col 1-->
<ul>
<li ng-repeat="z in myData">
{{ z.Type }}
</li>
</ul>
And my list.php file,
<?php
include_once("mysql_db/db.php");
$sql = "SELECT * FROM taxitype";
$data = retrieve($sql); // This execute mysqli functions and return an array
echo json_encode($data);
?>
But it is now displaying list in HTML file. What can be the reason? Is their any special way to create json objects for angularJS?
</div>
you should write response.data
instead of response.data.records
. as your JSON is an array
not object
.
See $http
service response object properties.
Here is your updated code.
<script>
var app = angular.module('myApp',[]);
app.controller('myCtrl',function($scope,$http){
$http.get("list.php").then(function(response) {
$scope.myData = response.data;
});
});
</script>
<div class="col-md-12"><!--col 1-->
<ul>
<li ng-repeat="z in myData">
{{ z.Type }}
</li>
</ul>