将数据传递给mdDialog

主列表页面有编辑button。 其中打开了编辑行的细节。
方式1：现在，如果我设置“ctrl.parent.q_details.client_location”，它绑定到父控制器，它作为双向绑定，并自动更改值在编辑框更改，这是不是要求在这里。
这里我只想在inputbox中显示和允许编辑值。 不想在父控制器中更改。

►以下是父控制器中调用mdDialog的代码

$mdDialog.show({ locals:{parent: $scope}, clickOutsideToClose: true, controllerAs: 'ctrl', templateUrl: 'quotation/edit/',//+edit_id, controller: function () { this.parent = $scope; }, }); 

►以下是popup的mdDialog的代码。

 <md-dialog aria-label=""> <div ng-app="inputBasicDemo" ng-controller="deliverController" layout="column"> <form name="" class="internal_note_cont"> <md-content class="md-padding"> <md-input-container class="md-input-has-value" flex> <label>Client Name</label> <input ng-model="qe.client_name" required > </md-input-container> <md-input-container flex> <label>Client Location</label> <input required ng-model="ctrl.parent.q_details.client_location"> </md-input-container> </md-content> </form> <div> </div> </div> <input type="" required ng-model="ctrl.parent.q_details.recid"> </md-dialog> 

方式2 ：第二种方式是直接从数据库发送值，而不绑定到对话框控制器的ng模型（deliverController）。

 ]).controller("deliverController", ["$scope", "$filter","$http","$route","$window","$mdDialog", function ($scope, $filter,$http,$route,$window,$mdDialog) { $scope.qe.client_name = '12345'; // just to test. } 

这给了undefine $ scope.qe错误。

所以最终，我不能发送数据到mdDialogue并显示它们，并允许以正常的方式编辑它们。 请任何经验丰富的angular色帮助我。 我是新angular度。 自2天以来，我尝试了不同的方法。

Answer 1

这家伙总是有正确的答案： https ： //github.com/angular/material/issues/455#issuecomment-59889129

简而言之：

 $mdDialog.show({ locals:{dataToPass: $scope.parentScopeData}, clickOutsideToClose: true, controllerAs: 'ctrl', templateUrl: 'quotation/edit/',//+edit_id, controller: mdDialogCtrl, }); var mdDialogCtrl = function ($scope, dataToPass) { $scope.mdDialogData = dataToPass } 

使用传递对象中的locals属性传递variables。 这些值将被注入控制器而不是$ scope 。 同时通过父母的整个范围可能不是一个好主意，因为它打败了孤立的范围范式。

Answer 2

HTML

 <md-button ng-click='vmInter.showDialog($event,_dataToPass)'> <i class="fa fa-custom-edit" aria-hidden="true"></i> </md-button> 

JS

  function _showSiebelDialog(event,_dataToPass) { $mdDialog.show({ locals:{dataToPass: _dataToPass}, //here where we pass our data controller: _DialogController, controllerAs: 'vd', templateUrl: 'contentComponents/prepare/views/Dialog.tmpl.html', parent: angular.element(document.body), targetEvent: event, clickOutsideToClose: true }) .then( function(answer) {}, function() { } ); }; function _DialogController($scope, $mdDialog,dataToPass) { console.log('>>>>>>> '+dataToPass); } 

Answer 3

 $scope.showPrompt = function(yourObject) { $mdDialog.show({ templateUrl: 'app/views/your-dialog.tpl.html', locals: { callback: $scope.yourFunction // create the function $scope.yourFunction = function (yourVariable) { }, controller: function ($scope, $mdDialog, callback) { $scope.dialog.title = 'Your title'; $scope.dialog.abort = function () { $mdDialog.hide(); }; $scope.dialog.hide = function () { if ($scope.Dialog.$valid){ $mdDialog.hide(); callback($scope.yourReturnValue, likes the return of input field); } }; }, controllerAs: 'dialog', bindToController: true, clickOutsideToClose: true, escapeToClose: true }); 

};

Answer 4

ES6 TL; DR方式

即时创build带有范围variables的控制器

 let showDialog = (spaceApe) => { $mdDialog.show({ templateUrl: 'dialog.template.html', controller: $scope => $scope.spaceApe = spaceApe }) } 

模板

Voilà， spaceApe现在可以用在对话框模板中

 <md-dialog> <md-dialog-content> <span> {{spaceApe | json}} </span> <md-dialog-content> <md-dialog>