angular 1.5 +材质对话框返回组件中的值

时间:2016-08-13 09:52:57

标签: angularjs angular-material

您好我正在尝试使用自定义md对话框创建角度组件。该对话框必须返回一个值,但我不知道如何访问回调中的组件var

  class TestDialog {
  constructor($mdDialog, $mdMedia) {
    'ngInject';
    this.$mdDialog = $mdDialog;
    this.$mdMedia = $mdMedia;

    this.objTmp={test:"test"};
  }

  open(event) {
    this.$mdDialog.show({
      controller($mdDialog) {
        'ngInject';

        this.close = () => {
          $mdDialog.hide();
        }
        this.answer = (answer) => {
          $mdDialog.hide(answer);
        };
      },
      controllerAs: 'testModal',
      template: '<md-dialog aria-label="Test" ng-cloak flex-gt-md="60"><form><md-toolbar><div class="md-toolbar-tools" layout-align="space-between center"><h2>Test Modal</h2><md-button ng-click="testModal.close()">Close</md-button></div></md-toolbar><md-dialog-content><div class="md-dialog-content"><md-input-container flex-gt-sm="50"><label>Value</label><input ng-model="testModal.value" required></md-input-container></div></md-dialog-content><md-dialog-actions layout="row"><md-button ng-show="testModal.value" class="md-raised md-primary" ng-click="testModal.answer(testModal.value)">Añadir</md-button></md-dialog-actions></form></md-dialog>',
      targetEvent: event,
      parent: angular.element(document.body),
      clickOutsideToClose: true,
      fullscreen: this.$mdMedia('sm') || this.$mdMedia('xs')
    }).then(function(answer) { 
        console.log(answer);
        console.log(objTmp);
        this.objTmp=answer;
        console.log(objTmp);
    }, function() {});
  }
}

angular.module('app', ['ngMaterial'])  
  .component('testDialog', {
  template: '<md-button class="md-raised" aria-label="'+ 'Open Dialog" ng-click="testDialog.open($event)">'+
'Open Dialog'+
'</md-button>',  
  controllerAs: 'testDialog',
  controller: TestDialog
});

这是codepen:

http://codepen.io/isibz/pen/yJkVLv

1 个答案:

答案 0 :(得分:-1)

在角料论坛回答了我的问题,使用胖箭头功能

then((answer) => { ...... }

https://groups.google.com/forum/#!topic/ngmaterial/ten0IaBY6eQ