-1

I have two controllers in my AngularJS apps. In my first Controller, I have an input/dropdown field, which value I want to use in second nested controller for each ng-Change. For example,

My Code (HTML) ::

<body ng-app="myApp" ng-controller="DropdownCtrl">
   <input type="text" class="form-control" ng-model="dt" ng-change="changeDate(dt)" /> 
   <span class="input-group-btn">
      <button type="button" class="btn btn-default" ng-click="open($event)">
          <i class="glyphicon glyphicon-calendar"></i>
      </button>
   </span>      

    <div class="row"  ng-controller="MainCtrl"> 
      <!-- other code -->
    </div>
</body>

Now what I want to do, when ng-Change is happening, I want to use changeDate(dt) function's value in MainCtrl

  • did you even look at any of the proposed questions in right sidebar that match same terms as yours in question? Always have a dot in `ng-model` – charlietfl Jul 11 '14 at 22:56
  • possible duplicate of [Angular: Share data between controllers](http://stackoverflow.com/questions/21919962/angular-share-data-between-controllers) – charlietfl Jul 11 '14 at 22:58
  • What do you mean "use in second nested controller for each ng-change?" – Explosion Pills Jul 11 '14 at 23:14

1 Answers1

1

In order for a parent controller to communicate with a child controller, the parent controller should use $scope.$broadcast('changedValue', dt);

This will broadcast to all children controllers the new value of dt. The childController should then listen for the change with the following code:

$scope.$on('parent-message', function (event, dt) {
    //you can now use dt in the child controller to do whatever it is you wanted
});

This is especially nice when using routeProviders and ng-view

Here is a great tutorial that explains this all really well:

arthurzp
  • 109
  • 3