不能在角材质模态对话框中设置控制器属性

Can't set property of controller in angular material modal dialog

本文关键字:设置 控制器 属性 对话框 模态 不能      更新时间:2023-09-26

我使用Angular 1.5和ES6和webpack,我的代码如下:

export default class HomeController {
  static $inject = ['$mdDialog', '$sce'];
  constructor($mdDialog, $sce) {
    this.$mdDialog = $mdDialog;
    this.tasks = [
      {
        label: "<strong>Something strong</strong>",
        id: 10
      }
    ];
    this.tasks = this.tasks.map(function(item) {
        item.label = $sce.trustAsHtml(item.label);
        return item;
    });
  }
  showRejectionDialog(ev, $index) {
    this.task = this.tasks[$index];
    this.index = $index;
    console.log(this.task);
    console.log(this.index);
    this.$mdDialog.show({
      controller: HomeController,
      preserveScope: true,
      controllerAs: 'vm',
      template: require('./rejectionDialogModal.jade'),
      parent: angular.element(document.body),
      targetEvent: ev,
    });        
  }
  allow($index) {
    this.tasks[$index].status = 'CONFIRMED';
  }
  reject(index) {
    this.$mdDialog.hide();
    console.log(index);
    console.log(this.task);
    console.log(this.index);
    //this.tasks[this.index].status = 'REJECTED';
  }
  cancel() {
      this.$mdDialog.cancel();
  }
}

和rejectionDialogModal。翡翠是这样的:

md-dialog(aria-label='Reject', ng-cloak='')
  form(name="rejectionForm")
    md-dialog-content
      .md-dialog-content
        h2.md-title Reject confirmation for
        div {{vm.task|json}}
        span(ng-bind-html="vm.task.label")
        textarea(placeholder="Please provide a reason for rejection", style="width: 530px; height: 75px")
    md-dialog-actions(layout="row")
      span(flex)
      md-button(ng-click="vm.cancel()") CANCEL
      md-button.md-primary.md-raised(ng-click="vm.reject(vm.index)") REJECT

showRejectionDialog中的console.log显示正确的值,但是reject显示未定义,也是vm。对话框内任务未定义,标签不显示。当我使用相同的控制器时,我如何将属性传递给模态对话框?

尝试创建一个可以访问$scope

的控制器函数
showRejectionDialog(ev, $index) {
    this.task = this.tasks[$index];
    this.index = $index;
    console.log(this.task);
    console.log(this.index);
    this.$mdDialog.show({
        controller: function () {
             this.parent = $scope;
        },
      preserveScope: true,
      controllerAs: 'vm',
      template: require('./rejectionDialogModal.jade'),
      parent: angular.element(document.body),
      targetEvent: ev,
    });        
  }