JSFiddle - React, Tailwind, and code Playground

by Krzysztof Safjanowski

HTML

<div ng-app="app">
    <div ng-controller="firstCtrl">
        <p>x: {{ someObject.x }}</p>
        <p>y: {{ someObject.y }}</p>
        <p>z: <input type="text" ng-model="someObject.z"></p>
    </div>
    <div ng-controller="secondCtrl">
        <p>x: {{ someObject.x }}</p>
        <p>y: {{ someObject.y }}</p>
        <p>z: {{ someObject.z }}</p>
    </div>
    
</div>

JavaScript

angular.module('app', []).service('testService', function() {
    var testService = {
        someObject: {
            x: 'x',
            y: 'y',
            z: ''
        }
    };
    return testService;
}).controller('firstCtrl', function($scope, testService) {
    $scope.someObject = testService.someObject;
}).controller('secondCtrl', function($scope, testService) {
    $scope.someObject = testService.someObject;
})