How to distribute ajax data between two controllers

Hi I have two controllers and in one I have defined some function to get data, I have saved data in $ scope.data1, now I want to access $ scope.data1 data in some other named controller so I can get access to the same on another page when loading along the route. How can i do this.

this is what my code is.

 commonApp.service('CommonServices',function($http){

            this.getData=function(urlreq){

                return $http({
                    method:"GET",
                    url   :urlreq
                });
            };
commonApp.controller('Controller1',function($scope,CommonServices,toaster){
           CommonServices.getData('dataurl1').success(function(getResponse){

                 $scope.data1=getResponse.success;  

           };
}
commonApp.controller('Controller2',function($scope,CommonServices,toaster){


                 $scope.data2= ????;    
//i want my $scope.data1 in $scop.data2. 


}




    });

      

+3


source to share


2 answers


I believe you are looking for something like this, where you use the same shared service to store a piece of data that can be fetched by any controller that has access to the service:

commonApp.service('CommonServices', function ($http) {
    this.shared = null;  // this is where the shared data would go

    this.getData = function (urlreq) {
        return $http({
            method: "GET",
            url: urlreq
        });
    };

    this.setSharedData = function (data) { // this sets the value of the shared data
        this.shared = data;
    };

    this.getSharedData = function () { // this retrieves the shared data
        return this.shared;
    }
});

commonApp.controller('Controller1', function ($scope, CommonServices, toaster) {
    CommonServices.getData('dataurl1').success(function (getResponse) {
        $scope.data1 = getResponse.success;
        CommonServices.setSharedData($scope.data1);

        // CommonServices.shared = $scope.data1; // this would also work
    });
});

commonApp.controller('Controller2', function ($scope, CommonServices, toaster) {
    $scope.data2 = CommonServices.getSharedData();

    // $scope.data2 = CommonServices.shared;  // this would also work
});

      

I was basing this on your own code sample, although I would probably structure things differently. But that does the main point, and I'm guessing your real need is a little more complex.



Note that you do not need to use setters and getters in the service, although that might make sense depending on the need to add things like null validation and overwriting existing values. You will see in the comments that I have included an example of how you can directly manipulate the properties of a service without configuring and getting functions.

Hope this helps, and remember to pick up and choose the accepted answer.

+2


source


You can save shared data to the service. For example, if you define a service as a factory:

        commonApp.factory('commonFactory', ['$http', function ($http) { 

return {
            commonData: null
        };

    }]);

      

Once in controllers you can access this commonData to store and retrieve data from it.

First controller:



commonFactory.commonData = getResponse.success;

      

Second controller:

$scope.data2= commonFactory.commonData; 

      

+1


source







All Articles