Passing data to AngularJS mddialog error

Question

Im having some trouble with $mdDialog function for AngularJS material. The prosess is like this:
1) HTTP.get request to API and save the data into $scope
2) ng-repeat on view for table
3) User can click on a row and modal is shown (this is problem)
4) The data from row clicked will be shown in modal as title

As you can see my AngularJS controller code:

 $scope.showAdvanced = function(ev, variable_name) {
        console.log(variable_name);
        $mdDialog.show({
            locals:{dataToPass: variable_name},
            templateUrl: 'save-dialog.tmpl.html',
            parent: angular.element(document.body),
            targetEvent: ev,
            clickOutsideToClose:true,
            isolateScope: false,
            controller: DialogController

        })
            .then(function(answer) {
                $scope.status = 'You said the information was "' + answer + '".';
            }, function() {
                $scope.status = 'You cancelled the dialog.';
            });
        function DialogController($scope, $mdDialog) {

            $scope.hide = function() {
                $mdDialog.hide();
            };

            $scope.cancel = function() {
                $mdDialog.cancel();
            };

            $scope.answer = function(answer) {
                $mdDialog.hide(answer);
            };
        }
    };

The error message i get in console is this(This happends ONLY when i add the line controller: DialogController inside $mdDialog.show, and im following the documentation right:

Docs: https://material.angularjs.org/latest/demo/dialog

variable_name is just a variable that i get from the row clicked, if anyone have any better solution please tell. Purpose of the modal is to write some data inside modal and click submit that sends data to DB.

This is the error message:

main.min.js:3 Error: [$injector:unpr] Unknown provider: tProvider <- t
http://errors.angularjs.org/1.5.11/$injector/unpr?p0=tProvider%20%3C-%20t
    at main.min.js:2
    at main.min.js:2
    at Object.r [as get] (main.min.js:2)
    at main.min.js:2
    at r (main.min.js:2)
    at i (main.min.js:2)
    at Object.a [as invoke] (main.min.js:2)
    at c.instance (main.min.js:3)
    at o._createController (main.min.js:17)
    at Object.i [as link] (main.min.js:17)

Answer 1

Using anonymous controller should solve your issue.

 $scope.showAdvanced = function(ev, variable_name) {
        console.log(variable_name);
        $mdDialog.show({
            locals:{dataToPass: variable_name},
            templateUrl: 'save-dialog.tmpl.html',
            parent: angular.element(document.body),
            targetEvent: ev,
            clickOutsideToClose:true,
            isolateScope: false,
            controller: function($scope, $mdDialog) {

              $scope.hide = function() {
                  $mdDialog.hide();
              };

              $scope.cancel = function() {
                  $mdDialog.cancel();
              };

              $scope.answer = function(answer) {
                  $mdDialog.hide(answer);
              };
          }
        }).then(function(answer) {
                $scope.status = 'You said the information was "' + answer + '".';
            }, function() {
                $scope.status = 'You cancelled the dialog.';
        });
    };

Concerning your dataToPass, you need to inject it too.

function($scope, $mdDialog, dataToPass){
    console.log(dataToPass) // Working
}

Answer 2

the md-dialog expects an angular controller.

you have to register your controller function as real angular controller (it also probably make sense to have this outside of the showAdvance function scope)

So do sth like this

angular
    .module('app')
    .controller('DialogController', DialogController);

and in your dialog configuration it needs to be a string so

$mdDialog.show({
    locals:{dataToPass: variable_name},
    templateUrl: 'save-dialog.tmpl.html',
    parent: angular.element(document.body),
    targetEvent: ev,
    clickOutsideToClose:true,
    isolateScope: false,
    controller: 'DialogController'
})