AngularJS - Example of setter and getter using Factory

<!DOCTYPE html>
<html>

  <head>
    <script src="https://code.angularjs.org/1.2.28/angular.js"></script>
    <script src="script.js"></script>
  </head>

  <body>
    <div ng-app="MyApp">
    <div ng-controller="ctrl1">
        <h2>Controller 1</h2>
             Set -> "{{valueA}}"  in Ctrl1
    </div>
    <br><br>
   <div ng-controller="ctrl2">
       <h2>Controller 2</h2>
            this is ctrl2 get -->  "{{valueB}}"
    </div>
</div>
  </body>

</html>

// Code goes here

var app = angular.module("MyApp", []);
app.factory("myService", function() {
    var theValue = {};
    theValue.setter = function(newValue) {
        theValue.value = newValue;
    }
    theValue.getter = function() {
        return theValue.value;
    }
    return theValue;
});
app.controller("ctrl1", ["$scope","myService", function($scope,myService) {
    /*Setter Call Example*/
    myService.setter("MyResult");
    
    /*Getter Call Example*/
   $scope.valueA = myService.getter();
}]);
app.controller("ctrl2", ["$scope","myService", function($scope,myService) {
     
    /*Getter Call Example*/
   $scope.valueB = myService.getter();
}]);

/* Styles go here */