AngularJS passing data back from mdDialog to parent controller

Question

I have a little Angularjs application making use of $mdDialog to pop up a html page that has one text input on it

I want to be able to return the value the user types in

Answer 1

The cleanest solution that I use is sending the data back when $destroy is fired. This is clean because it handles all cases for why the dialog is closing, ie when there's a click outside or the escape key is pressed or $mdDialog.hide() is called.

app.controller('CallerController', ['$scope', '$mdDialog',
    function($scope, $mdDialog) {

  $scope.some_event_listener = function(e) {
    $mdDialog.show({
      parent: angular.element(document.body),
      controller: SomeDialogController,
      templateUrl: 'some_dialog.html',
      locals: {
        on_complete: function(data_from_dialog_controller) {
          console.log(data_from_dialog_controller);
        }
      }
    });
  };

}]);

app.controller('SomeDialogController', ['$scope', '$mdDialog', 'on_complete',
    function($scope, $mdDialog, on_complete) {

  $scope.$on('$destroy', function() {
    on_complete($scope.some_input_model);
  });

}]);