Edit in JSFiddle

//    A little bit of data needed to get jsfiddle to fake an ajax request
var fiddleResponse = 'json=' + encodeURIComponent(angular.toJson({
    name: "Dave"
}));
var fiddleHeaders = {
    headers: {
            'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
        }
};

var app = angular.module('app', []);

app.factory('NameService', function($http, $q) {

    //    Create a class that represents our name service.
    function NameService() {
    
       var self = this;
              
        //    getName returns a promise which when fulfilled returns the name.
        self.getName = function() {
            //    Use jsfiddles 'echo' to simulate an ajax request that 
            //    returns 'dave'. This is '/api/my/name' in the example code.
            return $http.post('/echo/json/', fiddleResponse, fiddleHeaders);
        };
    }
    
    return new NameService();
});

app.controller('MainController', function ($scope, NameService) {

    //    We have a name on the code, but it's initially empty...
    $scope.name = "";
    
    //    We have a function on the scope that can update the name.
    $scope.updateName = function() {
        NameService.getName()
            .success(function(result) {
                $scope.name = result.name;
            })
            .error(function(response, status) {
                console.log("Failed to get the name, response is " + response + " and status is " + status); 
        });
    };
});

<div ng-app="app">
    <div ng-controller="MainController">
        <p><strong>Name:</strong> {{name}}</p>
        <a href ng-click="updateName()">Update Name</a>
    </div>
</div>