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

app.factory("DataService", function(rx) {
  var subject = new rx.Subject(); 
  var data = "Initial";
  
  return {
      set: function set(d){
        data = d;
        subject.onNext(d);
      },
      get: function get() {
        return data;
      },
      subscribe: function (o) {
         return subject.subscribe(o);
      }
  };
});

app.controller('updateCtrl', function(DataService){
  var $ctrl = this;
  $ctrl.update = function (v) {
      DataService.set(v);
  };
});

app.controller('displayCtrl', function(DataService) {
  var $ctrl = this;

  $ctrl.data = DataService.get();
  var subscription = DataService.subscribe(function onNext(d) {
      $ctrl.data = d;
  });

  this.$onDestroy = function() {
      subscription.dispose();
  };
});
<!DOCTYPE html>
<html ng-app="myApp">

  <head>
    <meta charset="utf-8" />
    <title>RX AngularJS Example</title>
    <script src="//unpkg.com/angular/angular.js"></script>
    <script src="//unpkg.com/rx/dist/rx.all.js"></script>
    <script src="//unpkg.com/rx-angular/dist/rx.angular.js"></script>
    <script src="app.js"></script>
  </head>

  <body>
    <h1>rx.angular Example</h1><hr>
    <div ng-controller="updateCtrl as $ctrl1" >
      <h1>Update</h1>
      <input ng-model="$ctrl1.value">
      <button ng-click="$ctrl1.update($ctrl1.value)">Update</button>
    </div>
    <hr>
    <div ng-controller="displayCtrl as $ctrl2">
      <h1>Display</h1>
      <p>{{$ctrl2.data}}</p>
    </div>
    <hr>
  </body>

</html>
body {
  font-size: 10em;
}