1

I have a form data that I need to share among different controllers before the actual submit.

I am using module.value() for holding the data as global. 

  var serviceApp = angular.module('sampleservice', [ ]);

   serviceApp.value('GData',{});

I want to know is this the best solution for this?

Anoj Philip
  • 110
  • 1
  • 7
  • Why not make a parent controller to both controllers and "play" with scope inheritance ? – Mik378 Oct 18 '13 at 13:15
  • possible duplicate of [Can one controller call another in AngularJS?](http://stackoverflow.com/questions/9293423/can-one-controller-call-another-in-angularjs) – Stewie Oct 18 '13 at 13:31

2 Answers2

2

You should not be using modules for this purpose. The best option is to use a service because it is for sharing persistent data between Controllers. 

var ControllerOne = function (someService) {

}

var ControllerTwo = function (someService) {

}

app.service('someService', function(){
    this.sayHello= function(text){
        return "Service says \"Hello " + text + "\"";
    };            
});

or use event on scope

var ControllerOne = function($scope) {
  $scope.$on('someEvent', function(event, data) {

  });
}

var ControllerTwo = function($scope) {
  $scope.$on('someEvent', function(event, data) {

  });
}

$rootScope.$broadcast('someEvent', [1,2,3]);
Gurpreet Singh
  • 20,907
  • 5
  • 44
  • 60
  • Thanks for the reply, my doubt is like why do we need a service and variable/property inside that, cannot we use the module.value() and we can inject that directly to the controllers? – Anoj Philip Oct 18 '13 at 13:25
  • Modules are not for this purpose. Services are standard for sharing data. Read more about modules here http://docs.angularjs.org/guide/module. Angular documentation clearly states this. – Gurpreet Singh Oct 18 '13 at 13:27
0

As indicated, one approach, as shown by this article: http://www.objectpartners.com/2013/08/21/using-services-and-messages-to-share-data-between-controllers-in-angularjs/ is to keep the data in a service and have each controller get notified of changes.

This means each controller would likely have their own copy of the data in their $scope so that their view can access it. Furthermore, you'll need to call $broadcast on the $rootScope in the service and $on in each controller to make sure the data is kept in sync.

Another approach that I prefer is to avoid using $rootScope to broadcast, and $on to keep the data in sync by simply keeping the data in an "app" controller and have your views point to it directly. The view still gets the data through the controller's scope, but through inheritance. You don't have to $broadcast or $on because there's nothing to keep in sync, and the service is truly stateless. The way the service gets its data is by passing to its methods the object in the app controller's scope.

I forked the plunk from the article I mentioned and modified to demonstrate this technique. I think you'll find that the resulting code is smaller and easier to understand. It is to me, anyway. I do realize some of this is a matter of preference.

http://plnkr.co/Ch1yJS

zumalifeguard
  • 8,648
  • 5
  • 43
  • 56