如何在 AngularJS 中将数据从子控制器发送到父控制器？

Question

I need some guidance to take the best practice for my task in AngularJS.

Task:

1. Inside the view : I have one parent controller and two child controllers.
2. Child controllers work with their own $scope and objects.
3. When I press save in the view, I need to get the data from child controllers to parent controller in order to prepare an object for posting it to the server.

I am getting confused of what is the best solution for this approach.

Answer 1

A common way of sharing data between controllers is to use use a service .

You could also broadcast updates to the parent controller

Answer 2

There are many different ways to achieve this..

1. Using $rootScope.
2. Using Services
3. Use broadcast and emit
4. Declare an object in parent controller and then modify the same object in the child controller.

Using $rootScope is not a good approach, as the $rootScope variable is destroyed when application is closed.

I will also not recommend broadCast or emit, until it's required.

Services, is good for communication b/w controllers, but again you have inject it and modify the methods.

In your, scenario, i would recommend to use the common $scope object variable, which is declared inside parent and used in child controllers, as all methods are inherited in the child controllers.

Answer 3

There are three common ways to share data between controllers:

1 put data in service or factory. Since they are singleton, any controller injected with same service can share the data within that service

2 put data in $rootScope

3 use $broadcast or $emit to send events between scopes, and pass the shared data as event arguments

Answer 4

Above answers are useful, but below is an simple way to update a $scope object in parent controller from child scope as below.

In child controller, $scope.$parent.parentObject = updatedObject

Hope it helps!