AngularJS Live Example

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://code.angularjs.org/1.0.6/angular-resource.js"></script>
<div ng-controller = "fessCntrl"> 
<ul>
  	    <li ng-click="alertSwap()">
  	      click 1
  	    </li>
    
  	  </ul>
  	  <ul>
  	    <pre>
  	      data {{data|json}}
  	    </pre>
         
  	  </ul>
</div>

JavaScript

var fessmodule = angular.module('myModule', ['ngResource']);

fessmodule.controller('fessCntrl', function ($scope, Data) {
        
    $scope.alertSwap = function () {           
               Data.getDeficiencyInfo().then(function (result) {
                        $scope.data = result;                           
                        }, function (result) {
                            alert("Error: No data returned");
                        });    
                      }  
    
    
});

fessmodule.$inject = ['$scope', 'Data'];

fessmodule.service('Data', ['$http','$q',  function($http, $q) {
    
    var address = 'Singapore, SG, Singapore, 153 Bukit Batok Street 1';
    var URL = 'http://maps.googleapis.com/maps/api/geocode/json?address=' + address + '&sensor=true';
           
           this.getDeficiencyInfo = function () {          
            var deferred = $q.defer(); 
                $http({method: 'GET', url: URL}).then(function(res){
                    deferred.resolve(res.data); 
                }, function (error) {
                      console.error(error);
                      deferred.resolve({error:error});
                  });    
                return deferred.promise;
           }; 
       
}]);