My current approach involves utilizing the code below to display data fetched from Parse API into a table using AngularJS and Bootstrap. However, the JavaScript section where I have defined the controller doesn't seem to be running as expected. Below is a snippet of the HTML code:
index.js
<!DOCTYPE html>
<html data-ng-app="parseApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.14/angular.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body >
<div class= "container" data-ng-controller="ParseController" >
<table class="table" >
<thead>
<tr>
<th>Email</th>
<th>Phone</th>
</tr>
</thead>
<tbody>
<tr data-ng-repeat="temp in user">
<td>{{temp.email}}</td>
<td>{{temp.phone}}</td>
</tr>
</tbody>
</table>
</div>
<script type="text/javascript">
var parse = angular.model('parseApp',[]);
function ParseController($scope, $http)
{
$http({method : 'GET',url :'https://api.parse.com/1/classes/User',
headers: {'X-Parse-Application-Id': 'XXXXXXX',
'X-Parse-REST-API-Key':'XXXXXX',
}}).success(function(data,status) {
console.log(data);
$scope.user = data;
}).error(function(data,status)
{
}
parse.controller('ParseController',ParseController);
}
</script>
</body>
</html>