conditional properties in angularJS Application between two controllers

Question

In My Application I have two controllers .

Controller 1 | Controller 2

---

1. From Controller 1 I am opening a menu on a button click and in a function defined a property say, this.isTelephoneMenuOpen = true;

Result : I am getting menu opened With two option edit and Remove.

2.From Controller 2 on click of edit I am opening a modal-overlay- working fine.

Issue :But not being able to hide the earlier opened menu.

How to use this property in another controller to hide the menu after modal gets opened?

Answer 1

Define the property as $rootScope as every application has a single root scope.

In Controller 1 - $rootScope.isTelephoneMenuOpen = true.

In Controller 2 - Set it to false after opening the menu $rootScope.isTelephoneMenuOpen = false.

Answer 2

One of the ways is broadcast event, have a look at the $rootScope.$broadcast().

For example, in the second controller you can broadcast an event

$rootScope.$broadcast('hideMenu', {hide: true})

and then catch it in the first controller

$scope.$on('hideMenu', function (event, data) {
  //code for hiding menu
});