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="loadGeo()">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.data = false;
    
    $scope.loadGeo = function () {
        Data.query()
            .then(function (result) {
            $scope.data = result.data.results[0];
        }, function (result) {
            alert("Error: No data returned");
        });
    }    
});

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

fessmodule.factory('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';

    var factory = {
        query: function () {
            var data = $http({
                method: 'GET',
                url: URL
            });

            var deferred = $q.defer();
            deferred.resolve(data);
            return deferred.promise;
        }
    }
    return factory;
}]);