Returning data from AngularJS service to controller with RxJS

Question

I am using web socket to connect to server. I am calling a service from controller. The request is going to server and response is coming back to service which is in app.js file.

Now I need the response in controller file.

Can any one help me how to send the response from app.js to controller from where the request is made.

app.js

app.factory('MyService', ['$rootScope', function($rootScope) {

    var Service = { };

    // Create our websocket object with the address to the websocket
    var ws = new WebSocket("Server_URL");

    ws.onopen = function(){  
        console.log("Socket has been opened!");  
    };

    ws.onmessage = function(message) {
      listener(message.data); 
    };

    function sendRequest(request) {
      console.log('Sending request:', request);
          ws.send(request);
    }

    function listener(data) {
      var messageObj = data;
      console.log("Received data from websocket: ", messageObj);
    }

    Service.getTemp = function(request) {
      sendRequest(request); 
    }
    return Service;
}])

controller.js

app.controller('myController', function($scope, $state, $rootScope,MyService) {
  $scope.currentTemp = MyService.getTemp('requestString');
 console.log( $scope.currentTemp );    

});

This link might help clintberry.com/2013/angular-js-websocket-service — Kalyan
– Kalyan, Commented Dec 21, 2017 at 3:54

georgeawg · Accepted Answer · 2017-12-21 04:37:31Z

Build the service with RxJS Extensions for Angular.

<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>

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

app.factory("DataService", function(rx) {
  var subject = new rx.Subject(); 
  // Create our websocket object with the address to the websocket
  var ws = new WebSocket("Server_URL");

  ws.onmessage = function(message) {
      subject.onNext(message); 
  };

  return {
      subscribe: function (o) {
         return subject.subscribe(o);
      }
  };
});

Then simply subscribe to the messages.

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

  var subscription = DataService.subscribe(function onNext(message) {
      $ctrl.message = message;
  });

  this.$onDestroy = function() {
      subscription.dispose();
  };
});

Clients can subscribe to messages with DataService.subscribe.

Collectives™ on Stack Overflow

Returning data from AngularJS service to controller with RxJS

app.js

controller.js

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

app.js

controller.js

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related