I have recently started learning AngularJS and trying to invoke REST service from AngularJS using $resource.My REST service is up and running and it gives me a json output when I hit the REST url in the browser but when I try to invoke it from AngularJS nothing happens. I am sure I am missing something.I have already googled this issue and also looked at similar questions on stackoverflow but I couldn't get it resolved and hence I am asking it here.
service.js
var services = angular.module('myApp.services', ['ngResource']);
services.factory('AngularIssues',
function($resource){
return $resource('http://localhost:8181/RestCXF5/services/UserInfo/:id', {} ,{
get:{method:'GET' , params: {id: '@id'} }
} );
});
services.value('version', '0.1');
controller.js
myApp.controller('fetchUserDetailsController', ['$scope', 'AngularIssues', function($scope, AngularIssues) {
AngularIssues.get({id:1} , function(UserDetails) {
$scope.UserDetails = UserDetails;
});
}]);
In my index.html , I have added
<script src="lib/angular/angular-resource.js"></script>
This is how I am calling my controller
<div class="col-lg-10" ng-controller="fetchUserDetailsController">
<table ng-table="tableParams" class="table">
<tr>
<td data-title=" 'Name' ">
{{UserDetails.firstName}}
</td>
<td>{{UserDetails.designation}}
</td>
<td>{{UserDetails.employeeId}}</td>
</tr>
</table>
</div>
My problem is that my REST service is not getting called at all and I get blank table in my html. Can anyone please point out what I am missing here?Thanks!!
I even tried using $http service and I get status as 400. Here is the code.
myApp.controller('fetchUserDetailsController' ,
['$scope' , '$http' , function($scope , $http){
$http.get('http://localhost:8181/RestCXF5/services/UserInfo/1').
success(function(data) {
$scope.UserDetails = data;
}).
error(function (data, status, headers, config) {
alert("error" + status);
});
}]);