0

I'm facing some issue while trying to pass the data from one controller to the other using my service.

I've been implementing the prototype inheritance using the $rootScope in my controller and broadcasting that object, so that I can access that data in the other controllers.

As I'm using the $rootScope, I'm polluting the global namespace, I'd like to pass the data from this controller to the other.

I'm just displaying minimal data inside a table, when the user clicks on specific record of the table, I want to display entire data inside the object.

This is how I'm handling.

<tr ng-repeat="contact in filterContacts = (contacts.contactsData | filter:sensitiveSearch | orderBy:selectBox) " ng-style="{'background-color': contact.email == selectedContact.email ? 'lightgrey' : ''}" ng-click="selectContact(contact)">

In Controller A: I'm calling this function from view and injecting the specific row contact detail.

$scope.selectContact = function(contact) {
                contactService.selectedContactInfo(contact);
            };

In the Service I'm just returning that data - 

var selectedContactInfo = function(contact) {
            return contact;
        };

How can I access this data in the Controller B during the same event and display it on my view.

Here is the reference Link: http://plnkr.co/edit/beOmiv?p=info

I don't want to use the $rootScope, but I'd like to access the data onto the other controller.

George Kagan
  • 5,913
  • 8
  • 46
  • 50
Sidd Thota
  • 2,040
  • 1
  • 20
  • 24
  • which angular version are you using ? – davidxxx Nov 15 '16 at 16:05
  • I'm using angular 1.4.9 – Sidd Thota Nov 15 '16 at 16:08
  • You have a full example here which could address your need : http://stackoverflow.com/questions/21919962/share-data-between-angularjs-controllers – davidxxx Nov 15 '16 at 16:17
  • how to sending access the data with single event between controllers. With ng-click I'm sending data from controller A to service, but since there isn't any event happening to retrieve the data from Controller B. I don't think the above thread answers my question. – Sidd Thota Nov 15 '16 at 17:32

1 Answers1

2

You could use an angular service for this.

The angular services are singletons and you inject them in controllers so you could inject the same service in two different controllers and you are effectively passing state between them.

Imagine you have a property in your service which could be called selectedUserID. You update this property when you click on the specific row. Then in the next controller, you inject the same service and use this property to determine which details you will load.

so you could have a method inside your service which could look like this :

updateSelectedUser = function(userID) {
    this.selectedUserID = userID;
}

Your controller then calls this method from the service when the click action happens :

myService.updateSelectedUser($scope.selectedUserID);

This is just an example of course, put your own values in there.

One thing to keep in mind : services can hold state, they are objects after all and singletons so you always inject the same instance.

It makes sense to make sure that the state stored inside the service is not modified by outside actions which do not go through this service. In other words make sure that nothing else changes this selectedUserID so your service state data never gets out of sync. If you can do this, then you are golden.

Andrei Dragotoniu
  • 6,155
  • 3
  • 18
  • 32
  • But my question is how to sending access the data with single event between controllers. With ng-click I'm sending data from controller A to service, but since there isn't any event happening to retrieve the data from Controller B, how am I supposed to handle that? – Sidd Thota Nov 15 '16 at 17:32