json - Angularjs issue $http.get not working -

i novice angularjs , tried follow example given $http.get on angularjs website documentation.

i have rest service, when invoked returns data follows:

http://abc.com:8080/files/rest/v1/list?&filter=file    {   "files": [     {       "filename": "a.json",       "type": "json",       "uploaded_ts": "20130321"     },     {       "filename": "b.xml",       "type": "xml",       "uploaded_ts": "20130321"     }          ],    "num_files": 2} 

part of contents of index.html file looks follows:

<div class="span6" ng-controller="fetchctrl">     <form class="form-horizontal">         <button class="btn btn-success btn-large" ng-click="fetch()">search</button>     </form>       <h2>file names</h2>       <pre>http status code: {{status}}</pre>      <div ng-repeat="file in data.files">       <pre>filename: {{file.filename}}</pre>     </div> 

and js file looks follows:

function fetchctrl($scope, $http, $templatecache) {   $scope.method = 'get'; $scope.url = 'http://abc.com:8080/files/rest/v1/list?&filter=file';    $scope.fetch = function() {     $scope.code = null;     $scope.response = null;      $http({method: $scope.method, url: $scope.url, cache: $templatecache}).       success(function(data, status) {         $scope.status = status;         $scope.data = data;       }).       error(function(data, status) {         $scope.data = data || "request failed";         $scope.status = status;     });   };       } 

but when run this, not see result filenames , see http status code = 0

when run ,

http://abc.com:8080/files/rest/v1/list?&filter=file

in browser, still can see desired results (as mentioned above)

i tried debug using firebug in firefox, see above url gets invoked when hit "search" button response looks empty. , interestingly in firebug under url, shows

    options "above url"  

instead of

    "above url" 

can please let me know, doing wrong , why not able access json data ?

thanks,

this because how angular treats cors requests (cross-site http requests). angular adds http headers default why seeing options request instead of get. try removing x-requested-with http header adding line of code:

delete $http.defaults.headers.common['x-requested-with']; 

regarding cors, following mentioned on mozilla developer network:

the cross-origin resource sharing standard works adding new http headers allow servers describe set of origins permitted read information using web browser.