JSFiddle - React, Tailwind, and code Playground

by Jeff

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-rc.2/angular.min.js"></script>
<div ng-app="myApp">
    <div ng-controller="mainController as main">
        {{global.title}}
    </div>
    <div ng-controller="testController as test">
        <a href="" ng-click="update()">Link</a>
    </div>
</div>

JavaScript

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

app.service("globalService", function(){
    this.title = "Test Title";
    this.page = "Test Page";
});

app.controller("mainController", ["$scope", "globalService", function($scope, globalService){
    $scope.global = globalService;
}]);

app.controller("testController", ["$scope", "globalService", function($scope, globalService){
    $scope.global = globalService;
    $scope.update = function(){
        globalService.title = "New Title";
    }
}]);