AngularJS Example:

HTML

<div ng-app="myApp">


    <div ng-controller="FirstCtrl">
        <input type="text" ng-model="data.message">
        <h1>{{data.message}}</h1>
    </div>



    <div ng-controller="SecondCtrl">
        <input type="text" ng-model="data.message">
        <h1>{{reversedMessage(data.message)}}</h1>
    </div>


</div>

CSS

</style> <!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ --> 
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/foundation/3.2.2/stylesheets/foundation.min.css">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<style>

JavaScript

var myApp = angular.module('myApp', []);
myApp.factory('Data', function () {
    return {message:"I'm data from a service"}
})

function FirstCtrl($scope, Data) {
    $scope.data = Data;
}

function SecondCtrl($scope, Data) {
    $scope.data = Data;

    $scope.reversedMessage = function (message) {
        return message.split("").reverse().join("");
    }
}