How pass data to $mdDialog in angular material

Question

I want to pass some data to $mdDialog. In fact, I have two controllers in a separate file. Here is my controller code

function openDialog(id) { $mdDialog.show({ locals:{ profileId: id }, controller: ['$scope', 'profileId', function($scope, profileId) { var self = this; self.profileId= profileId; }], controllerAs: 'profileCtrl', templateUrl: 'view/profile.html', parent: angular.element(document.body), clickOutsideToClose:true }) }

I want tp pass profileId to profileController and display profile data. In profile controller i get data as this

function profileController($scope,..., profileId){ }

but this error apear in console

 Error: [$injector:unpr] Unknown provider: profileIdProvider <- profileId<- ProfileController

what is this error and how to fix it?

Hadi · Accepted Answer · 2016-06-22 04:13:42Z

I added ng-controller="ProfileController as profileController" in profile template and this was due to an error. By removing it my problem solved.

Coder002 · Accepted Answer · 2016-01-13 09:36:12Z

I think you must do this:

controller: ['$scope', function($scope) { var self = this; self.profileId= $scope.profileId; }]

Your profileId Is in the scope.

You can use locals to pass data: Exemple from official website:

function showDialog($event) { var parentEl = angular.element(document.body); $mdDialog.show({ parent: parentEl, targetEvent: $event, template: '<md-dialog aria-label="List dialog">' + ' <md-dialog-content>'+ ' <md-list>'+ ' <md-list-item ng-repeat="item in items">'+ ' <p>Number {{item}}</p>' + ' '+ ' </md-list-item></md-list>'+ ' </md-dialog-content>' + ' <md-dialog-actions>' + ' <md-button ng-click="closeDialog()" class="md-primary">' + ' Close Dialog' + ' </md-button>' + ' </md-dialog-actions>' + '</md-dialog>', locals: { items: $scope.items }, controller: DialogController });

Where items is a data passed to the dialog

Not really answer for the question, I want to keep code separated not good to put all code in 1 page, hard to follow and maintenance.

Shaya · Accepted Answer · 2017-08-25 23:43:04Z

Take the fast route!

openDialog = (items) => $mdDialog.show({ templateUrl: 'view/profile.html', controller: $scope => $scope.items = items })

$scope.items can now be used in the dialog template ☺

Collectives™ on Stack Overflow

How pass data to $mdDialog in angular material

3 Answers 3

Comments

1 Comment

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Linked

Related