How to pass a result from modal of angular-ui-bootstrap to parent without closing?

Question

according to the https://angular-ui.github.io/bootstrap/#/modal, I want to pass a result from modal to the parent without closing but in the example code, they only show a passing result to parent via closing

$uibModalInstance.close($scope.selected.item);

I want to pass a data to parent when the item is clicked but I do not know to do it. I really need help. Thanks.

you can use event, a shared service etc. – Kobi Cohen Feb 12 '16 at 13:27 — Kobi Cohen, Feb 12 '16 at 13:27

score 3 · Accepted Answer · edited Mar 15 '19 at 17:55

This is a quite common problem about communicating between controllers since you don't want to close the model and wants to pass the data to a different controller.

The quickest path to your problem is using $broadcast. In the controller of your modal, write like this:

// Make sure to use $rootScope
$rootScope.$broadcast("modalDataEventFoo", {selectedItem: $scope.selected.item});

Now, in your parent controller:

$scope.$on("modalDataEventFoo", function(event, data) {
     console.log("got the data from modal", data.selectedItem);
});

Other references for communication between controllers:

Note that the arguments passed to the listener function are: (event, data) and not just (data) as shown in the example above. — Charlie Hills, Jan 28 '18 at 14:22

score 1 · Answer 2 · answered Feb 12 '16 at 15:58

Another way is to share the scope between the parent controller and the modal controller declaring scope property in the options:

var modalInstance = $uibModal.open({
  animation: $scope.animationsEnabled,
  templateUrl: 'myModalContent.html',
  controller: 'ModalInstanceCtrl',
  size: size,
  scope: $scope,
  resolve: {
    items: function () {
      return $scope.items;
    }
  }
});

Check this plunker in which the modal contains an input element bound to the variable $scope.shared.name: http://plnkr.co/edit/4xiEXATxAnvDKBSXxzQd

How to pass a result from modal of angular-ui-bootstrap to parent without closing?

2 Answers2