<!DOCTYPE html> <html> <head> <script src="angular.js"></script> <script src="script.js"></script> </head> <body ng-app="mainModule"> <div ng-controller="mainController"> <strong>First name:</strong> {{personManagerInstance.getPersonFirstName()}}<br /> <strong>Last name:</strong> {{personManagerInstance.getPersonLastName()}}<br /> <strong>Full name:</strong> {{personManagerInstance.getPersonFullName("*")}}<br /> <br /> <label>Set the first name: <input type="text" ng-model="personManagerInstance.personInstance.firstName"/></label><br /> <label>Set the last name: <input type="text" ng-model="personManagerInstance.personInstance.lastName"/></label> </div> </body> </html>
// Definition of a PersonManager object var PersonManager = function (person) { this.personInstance = person; }; PersonManager.prototype.getPersonFirstName = function () { return this.personInstance.firstName; }; PersonManager.prototype.getPersonLastName = function () { return this.personInstance.lastName; }; PersonManager.prototype.getPersonFullName = function (separator) { return this.personInstance.firstName + separator + this.personInstance.lastName; }; // Initialization of the "mainModule" angular.module("mainModule", []) // Register an object instance as a value and name it "person" .value("person", { firstName: "", lastName: "" }) // Register a service with person management functions and name it "personManager". // This service requires the "person" object instance registered as a value in the // "mainModule" and that instance is passed to the constructor through Dependency Injection // simply writing "person" (the name of the registered value) as parameter name. .service("personManager", PersonManager) // Get the "person" registered object instance and the "personManager" // service (an instance of "PersonManager") through Dependency Injection. .controller("mainController", function ($scope, person, personManager) { // Initialize the values of the "person" instance registered // as an object in the "mainModule". This is the same instance // that the "personManager" service gets through Dependency Injection // because there's only a single instance registered with a given name. person.firstName = "John"; person.lastName = "Doe"; // Set a variable on the scope to reference the "personManager" service // from the HTML template. $scope.personManagerInstance = personManager; });



If we want to register a simple recipe to create object instances with a constructor function and that might accept other object instances as input, then we could use the service method of a module.

As we can see in the example, we define a PersonManager object recipe by writing the constructor function and adding other functions to the prototype. The constructor accepts a person object instance.

We register a person value in the module and that's exactly what will be passed to the PersonManager's constructor because that argument has exactly the same name as the registered value. We just need to use the module's service method to register the PersonManager object recipe and the person value will be automatically passed to its constructor by Dependency Injection.

We can have an instance of PersonManager inside our controller again thanks to the Dependency Injection by writing personManager (the name we've used to register the service) in the controller creation function of mainController and we can have the value instance person as well if we need it.