JSFiddle - React, Tailwind, and code Playground

HTML

<body ng-app="serviceApp">

  <div ng-controller="myCtrl">
    name:{{name}}
    <br/>
    age:{{age}}
    <br/>
    love:{{love}}
    <br/>
    money:{{money}}
    <br/>
    id:{{id}}
  </div>
  <hr/>
  <div ng-controller="myOtherCtrl">
    name:{{name}}
    <br/>
    love:{{love}}
    <br/>
  </div>
  <hr/>

</body>

CSS

* {
      font-family:'MICROSOFT YAHEI'
    }

JavaScript

var serviceApp = angular.module('serviceApp',[]);

serviceApp.controller('myCtrl',function($scope,myConfig){
    $scope.name = myConfig.name;
    $scope.love = myConfig.love;
    $scope.age = myConfig.age;
    $scope.id = myConfig.getId();
    $scope.$watch(myConfig.love,function(){$scope.love = myConfig.love;});
});

serviceApp.controller('myOtherCtrl',function($scope,myConfig){
    $scope.name = myConfig.name;
    $scope.love = myConfig.love;
    angular.extend(myConfig,{love:'zxg'});
    $scope.$watch(myConfig.love,function(){$scope.love = myConfig.love;});
});


serviceApp.constant('myConfig',{
    name:'code_bunny',
    age:12,
    getId:function(){
        return 1
    }
});