JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-controller="ControllerOne">
    <button ng-click="setNumber(1)">One</button>
    <button ng-click="setNumber(2)">Two</button>
</div>
<div ng-controller="ControllerTwo">{{number}} was chosen!</div>

JavaScript

var app = angular.module('app', []);

app.factory("Service", function () {
    var number = 1;
     function getNumber() {
        return number;
    }
    function setNumber(newNumber) {
        number = newNumber;
    }
    return {
        getNumber: getNumber,
        setNumber: setNumber,
    }
});

function ControllerOne($scope, Service) {
    $scope.setNumber = Service.setNumber;
}

function ControllerTwo($scope, Service) {
    $scope.$watch(function () { return Service.getNumber();         }, function (value) {
        $scope.number = value;
    });
}