CODEWITHSUNDEEP
javascriptangularjsangular-material
Hugo Seleiro
Hugo Seleiro

Reputation: 2657

Call function inside $mdDialog from parent controller

I need to call a function in $mdDialog. This function is being passed to my directive from the parent.

<get-list callback="getList()" ></get-list>

To get the function on my get-list directive.

function directive() {

  return {
    restrict: 'E',
    scope: {
      callback: '&?'
    },
    templateUrl: "",
    controller: function($scope) {
      'ngInject';

}

now inside my get-list directive, I have a $mdDialog.

  $scope.save = function(){
    $mdDialog.show({
      templateUrl: '',
      escapeToClose: true,
      clickOutsideToClose: true,

      controller: function($scope) {

        $scope.teste = function(){
          $scope.callback()
        }

      }
    })
  }

I need to call the function getList() inside it, and I'm getting the error $scope.callback() is not a function

Upvotes: 2

Views: 682

Answers (1)

Karim
Karim

Reputation: 8632

$mgDialog has an isolated scope that is different from the one of your directive, you can try to keep track of the original scope and use it in $mgDialog controller

 $scope.save = function(){
    var outerScope = $scope;
    $mdDialog.show({
      templateUrl: '',
      escapeToClose: true,
      clickOutsideToClose: true,
      controller: function($scope) {
        $scope.teste = function(){
          outerScope.callback();
        }
      }
    })
  }

or pass the callback as a parameter

$scope.save = function(){
    $mdDialog.show({
      templateUrl: '',
      escapeToClose: true,
      clickOutsideToClose: true,
      locals: {
        callback: $scope.callback
      },
      controller: function($scope, callback) {
        $scope.teste = function(){
          callback();
        }
      }
    })
  }

Upvotes: 1

Related Questions