JSFiddle - React, Tailwind, and code Playground
HTML
<div ng-app="myApp" ng-controller="Ctrl2">
<input ng-model="newData"></input>
<button ng-click="setProperty(newData)">Update Property</button>
<ul>
<li>{{prop2}}</li>
<li>{{sharedProperty.data}}</li>
</ul>
</div>
JavaScript
angular.module('myApp', [])
.service('sharedProperties', function () {
var property = {
data: "First"
};
return {
getProperty:function () {
return property;
},
setProperty:function (value) {
property.data = value;
}
};
});
function Ctrl2($scope, sharedProperties) {
$scope.prop2 = "Second";
$scope.sharedProperty = sharedProperties.getProperty();
$scope.setProperty = sharedProperties.setProperty;
}