How do we call the child controller when parent controller ng-click directive called?

Question

I am new to angular js and the following code am using in my project here my problem is when i click on ng-click=addtocart(parameter) it is not responding the child controller.?how can i call the child controller ?please help me out?

<div ng-app="" ng-controller="parentCtrl">
    <ul>
    <li ng-click="search('12345');">
    <div >
        <div>
        <div><img src="ProfileImges/menu.jpg"/></div>
        <div>Hello</div>
        </div>
    </div>
    </li>
    </ul>
    <div ng-repeat="x in names">
        <div ng-click="addToCart('SMN1');">
        <div>
            <h4> {{ x.Price }} per meal</h4>
            <img  ng-src="{{x.ImgSrc}}"/>
        </div>
        <div>
            <img ng-src="{{x.UserImg}}"/>
            <p><strong>{{x.Uname}}</strong><br>
                <span>{{x.RewPer}} </span><br>
            </p>
        </div>
        <h4>{{x.Mtitle}}</h4>
        <span><strong>{{x.Cuisine}}</strong></span>
        <p`enter code here`>{{x.Mdesc}}</p>
        </div>
    </div>
    <div ng-controller="childCtrl">
    <div>{{cartdetails.name }}</div>
    <div>Price</div>
    </div>
    </div>

    <script>
    var sj=angular.module('MyApp', []);
    sj.controller('parentCtrl', ['$scope','$http', function($scope, $http) {
      $scope.search = function(param) {alert("enter123");
          $http.get('AngularJs-Response.jsp?mid='+param).success(function(response) {
            $scope.names = response;
          });
      };
      $scope.addToCart=function(smid){
          CallAddCart(smid);
      };
    }]);
    function CallAddCart(smid) {
        sj.controller('childCtrl', ['$scope','$http', function($scope, $http) {
                  $http.get('reponse.jsp?smid='+smid).success(function(response) {alert(response);
                  $scope.cartdetails = response;    
                  });
            }]);
    };
    </script>

Answer 1

See plnkr: http://plnkr.co/edit/IdsHc19xBUalZoIXPE2T?p=preview In a nutshell, you can communicate from parent to child controller by using the $scope as an event bus via the $broadcast and $on APIs:

    angular.module("app", [])
  .controller("ParentCtrl", function($scope) {
    $scope.parentName = "parent";
    $scope.onClick = function() {
      $scope.parentName = "clicked";
      $scope.$broadcast('onSearch', {myMsg: "hi children"});
    }
  })
  .controller("ChildCtrl", function($scope) {
    $scope.childName = "child";
    $scope.$on('onSearch', function(event, obj) {
      $scope.childName = obj.myMsg;
    })
  });

After onClick() is called on the parent, the parent $broadcasts the 'name' on the 'onSearch' channel to all its children. ChildCtrl is configured to listen on the 'onSearch' channel, once it receives a message, the callback function executes.