$mdDialog: locals not working!

[aozora]

Hi,
The locals option for $mdDialog service is not working: how to pass objects to the dialog scope?

[rschmukler]

Locals injects things into the controller, not onto the scope.

mdDialog.show({locals: { name: 'Bob' }, controller: 'myController'});

module.controller('myController', function($scope, name) {
  $scope.name = name;
});

[ajoslin]

You can also do it a bit more conveniently inline:

$mdDialog.show({
  locals: { name: 'Bob' },
  controller: ['$scope', 'name', function($scope, name) { 
    $scope.name = name;
  }]
});

[aozora]

Cool!
thanks!

[thallukrish]

Thanks, a bit that can be easily overlooked looking at the example.

Why do we have such roundabout way of passing parameters to mdDialog.show?

[jadjoubran]

Because it has an isolated scope.

"The dialog is always given an isolate scope." from https://material.angularjs.org/latest/#/api/material.components.dialog/service/$mdDialog

[gkalpak]

This isn't 100% accurate. You can pass your own scope (but if you don't then a new isolate scope will be created and used).

[assaftenen]

What about passing scope data from the dialog into the parent one?

[Vijay1990]

cool!
Work like a charm!!

[ViruSzZ]

Hello,

I'm not sure whether I'm doing something wrong but locals aren't working for me. I have the following:

   <md-button ng-click='listObjects.viewDetailsDialog($event, object)'>

and also this

    this.viewDetailsDialog = (ev, obj) => {
        $mdDialog.show({
          templateUrl: 'client/objects/list-objects/view-details.dialog.html',
          clickOutsideToClose: true,
          openFrom: {top: -50, width: 30, height: 80},
          closeTo: {left: 500},
          preserveScope: true,
          targetEvent: ev,
          locals: { item: obj }
        });
      }

the obj object isn't passed to view-details.dialog.html. Any thoughts what I'm doing wrong?

---

EDIT:

Ok, I've just got it working by changing the viewDetailsDialog method to:

    this.viewDetailsDialog = (ev, obj) => {
        $mdDialog.show({
          templateUrl: 'client/objects/list-objects/view-details.dialog.html',
          clickOutsideToClose: true,
          openFrom: {top: -50, width: 30, height: 80},
          closeTo: {left: 500},
          preserveScope: true,
          targetEvent: ev,
          locals: { item: obj },
          controller: ['$scope', 'item', function($scope, item) {
            $scope.item = item;
          }]
        });
      }

[christrude]

3 things:

1. you have to declare a controller for the dialog (not sure if you are doing that from this example
2. you have to have ‘item’ in the controller dependency list ( .controller('CatalogCtrl', function ($scope, $http, $timeout, item){})
3. you have to set ‘item’ into the scope in the controller ( $scope.item = item;)

[ThomasBurleson]

@ViruSzZ - Please look at $mdDialog Documentation to see how locals are used with controllers.