JSFiddle - React, Tailwind, and code Playground

by ynonp

HTML

<div ng-controller="Ctrl1">
    <div> Ctrl1 Status is: {{status}}
    </div>
    <div>
        <input type="text" ng-model="localData1" />
    </div>
<div ng-controller="Ctrl2">Ctrl2 Status is: {{status}}
    <div>
        <input type="text" ng-model="localData2" />
    </div>
</div>

JavaScript

angular.module('myApp', [])
    .controller('Ctrl1', function ($scope, App) {
        $scope.localData1 = App.getStatus();
})
    .controller('Ctrl2', function ($scope, App) {
        $scope.localData2 = App.getStatus();
})
    .service('App', function () {
        this._data = { status: 'Good' };
        this.getStatus = function() {
            return this._data.status;
        };
        
        this.setStatus = function(newStatus) {
            this._data.status = newStatus;
        };
});