Saturday 28 April 2018

Passing data between controllers using ‘service’ in AngularJS



        In this article I would like to know you about Passing data between angularjs controllers using ‘service’, actually we can maintain data  using $sessionStorage throughout the application. But If we want to pass data from one angularjs controller to other angularjs controller within the application, then we can use custom service. For that First declare a service :


app.service('GoodsDetailsService', function () {
    this.Items = function () {
        // if we want can get data from database
        goods = { goodsid: '', goodsname:'', quantity:'', price: '' }
    };
    return this;
});

Now call this service in controller where you want to assign some values and use them in another controller.

app.controller('goodsListController', ['$scope', '$http', '$state', 'GoodsDetailsService', function ($scope, $http, $state, GoodsDetailsService) {

$scope.NavigateToOtherController = function () {
             
                    GoodsDetailsService.goodsid = "1001";
                    GoodsDetailsService.goodsname = "Mouse";
                    GoodsDetailsService.quantity = "50";
                    GoodsDetailsService.price = "300";

                    $state.go('stock');               
            }

}]);

Now write another controller, where we want to receive the previous controllers data as below :

app.controller('StockController', ['$scope', '$http', '$state', 'GoodsDetailsService',
        function ($scope, $http, $state, GoodsDetailsService) {

    $scope.StockReceived.Id = GoodsDetailsService.goodsid;
    $scope.StockReceived.Name = GoodsDetailsService.goodsname;
    $scope.StockReceived.Quantity = GoodsDetailsService.quantity;
    $scope.StockReceived.Price = GoodsDetailsService.price;


}]);

This is one of the way to pass data from one controller to other controller using custom service.

No comments:

Post a Comment

Note: only a member of this blog may post a comment.