JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="APP">
    <h2>angularjs sample</h2>
    <div ng-controller="userController">        
        <div>{{golbal_sitename}}</div>
        <div>{{controllerName}}</div>
        <div><button ng-click="sayHello()">sayHello</button></div>
    </div>
    <hr />
     <div ng-controller="customerController">        
        <div>{{golbal_sitename}}</div>
         <div>{{controllerName}}</div>
         <div><button ng-click="sayHello()">sayHello</button></div>
    </div>
</div>

JavaScript

var APP = angular.module('APP',[]).
controller('userController', ['$scope','dataService',function($scope,dataService) {
       $scope.controllerName='userController';
       $scope.golbal_sitename=dataService.golbal_sitename;
       $scope.sayHello =function(){
           dataService.sayHello($scope.controllerName);
       }
}]).
controller('customerController',['$scope','dataService', function($scope,dataService) {
       $scope.controllerName='customerController';
       $scope.golbal_sitename=dataService.golbal_sitename;
       $scope.sayHello =function(){
           dataService.sayHello($scope.controllerName);
       }
}]).
factory('dataService',function(){
    return {
        golbal_sitename:"this is the shared value",
        sayHello:function(msg){
            alert(msg);
        }
    }
});