title: Binding scope object to factory object
body: <p>I am connecting to a websocket feed in a factory, which gives me real time bitcoin price data. </p>
  
  <p>I define <code>service.prices</code> as an object in <code>websocketFactory</code>, and set <code>wsvm.prices = websocketFactory.prices</code> in the controller. </p>
  
  <p>The <code>wsvm.prices.btc</code> property is not updating in the view, but is logging correctly in console. </p>
  
  <p>code:</p>
  
  <p>factory</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>app.factory('websocketFactory', ['$http', function($http) {
    var service = {}
    service.prices = {
      "btc": 0
    }
    service.gdax = function() {
      const socket = new WebSocket('wss://ws-feed.gdax.com')
      var message = {
        "type": "subscribe",
        "channels": [{
          "name": "ticker",
          "product_ids": [
            "BTC-USD"
          ]
        }, ]
      }
  
      socket.addEventListener('open', function(event) {
        socket.send(JSON.stringify(message));
      })
  
      // Listen for messages
      socket.addEventListener('message', function(event) {
        var dataObj = JSON.parse(event.data)
        if (dataObj.price) {
          console.log(dataObj.price) //logging real time data
          service.prices.btc = dataObj.price //this should be updating the view
        }
      });
    }
  
    return service
  }])</code></pre>
  </div>
  </div>
  </p>
  
  <p>controller</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>app.controller('WebsocketController', WebsocketController)
  WebsocketController.$inject = ['$scope', 'websocketFactory']
  
  function WebsocketController($scope, websocketFactory) {
  
    var wsvm = this
  
    wsvm.prices = websocketFactory.prices
    
    websocketFactory.gdax()
  
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>view</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div ng-controller="PortfolioController as vm"&gt;
    &lt;div class="row"&gt;
      &lt;div class="col-sm-6"&gt;
        &lt;h2 style="text-align: center;"&gt;Account Balances&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="col-sm-6"&gt;
        &lt;table class="table"&gt;
          &lt;thead&gt;
            &lt;tr&gt;
              &lt;td&gt;24h Change&lt;/td&gt;
              &lt;td&gt;Total Val USD&lt;/td&gt;
              &lt;td&gt;BTC Price&lt;/td&gt;
            &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt;
            &lt;tr&gt;
              &lt;td ng-class="{change_loss: vm.totals.change_24h_usd &lt; 0, change_win: vm.totals.change_24h_usd &gt; 0}"&gt;&lt;b&gt;{{vm.totals.change_24h_usd | currency}}&lt;/b&gt;&lt;/td&gt;
              &lt;td&gt;&lt;b&gt;{{vm.totals.total_usd | currency}}&lt;/b&gt;&lt;/td&gt;
              &lt;td ng-controller="WebsocketController as wsvm"&gt;{{wsvm.prices.btc}}&lt;/td&gt;
            &lt;/tr&gt;
          &lt;/tbody&gt;
        &lt;/table&gt;
      &lt;/div&gt;
    &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>How to correctly bind factory to controller for real time data?</p>