<!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> {{personInstance.firstName}}<br /> <strong>Last name:</strong> {{personInstance.lastName}}<br /> <strong>Full name:</strong> {{personInstance.getFullName()}}<br /> <br /> <label>Set the first name: <input type="text" ng-model="personInstance.firstName"/></label><br /> <label>Set the last name: <input type="text" ng-model="personInstance.lastName"/></label> </div> </body> </html>
angular.module("mainModule", []) // Register an object instance as a value and name it "person" .value("person", { firstName: "", lastName: "", getFullName: function () { return this.firstName + " " + this.lastName; } }) // Get the "person" registered object instance through Dependency Injection .controller("mainController", function ($scope, person) { person.firstName = "John"; person.lastName = "Doe"; // Set a variable on the scope to reference the "person" instance // from the HTML template. $scope.personInstance = person; });



In an AngularJS module we can register object instances or recipes to create instances, then we can have them available through Dependency Injection.

We can register an object instance through the value method.

In the example, we register an object instance and we name it person. The name of a registered instance has to be unique in the module (it's basically a singleton).

When we declare mainController we can have our registered person object through Dependency Injection by simply specifying the name person as an argument of the controller function.