JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="myApp" ng-controller="Ctrl2">
    <input ng-model="newData"></input>
    <button ng-click="sharedProperties.setProperty(newData)">Update Property</button>
    <ul>
        <li>{{prop2}}</li>
        <li>{{both}}</li>
    </ul>
</div>

JavaScript

angular.module('myApp', [])
    .service('sharedProperties', function () {
        var property = "First";

        return {
            getProperty:function () {
                return property;
            },
            setProperty:function (value) {
                property = value;
            }
        };
    });

function Ctrl2($scope, sharedProperties) {
    $scope.prop2 = "Second";
    $scope.both = sharedProperties.getProperty() + $scope.prop2;
    
    $scope.sharedProperties = sharedProperties;
    $scope.$watch('sharedProperties.getProperty()', function(newValue) {
        alert(newValue);
    });
}