包裹在 md-dialog 控制器中的 md-dialog 功能障碍触发按钮

Question

我按照 documentation 生成了有效的 md-dialog，但我一直停留在功能失调的按钮上，它会触发对话框。打开和关闭对话框后，触发按钮（在该控制器中使用脚本的所有内容）似乎无法正常工作。

这是CodePen和代码。

var app = angular.module('app', ['ngMaterial', 'ngAnimate']);

// Dialog controller
app.controller('showDialogCtrl',
  function ($scope, $mdDialog) {
    // Showing order form dialog
    $scope.showDialog= function($event){
      $mdDialog.show({
         targetEvent: $event,
         clickOutsideToClose: true,
         scope: $scope,
         template: 
            '<md-dialog>' +
            '  <md-dialog-content>Hello!</md-dialog-content>' +
            '  <md-dialog-actions>' +
            '    <md-button ng-click="closeDialog()" class="md-primary">' +
            '      Close' +
            '    </md-button>' +
            '  </md-dialog-actions>' +
            '</md-dialog>',
         parent: angular.element(document.body),
         controller: DialogController,
      });
      function DialogController($scope, $mdDialog) {
        $scope.closeDialog = function() {
          $mdDialog.hide();
        };
      };
    }
});    

<md-button ng-controller="showDialogCtrl" ng-click="showDialog($event)">
Click
</md-button>

Answer 1

您正在将父项 $scope 传递给您的对话框，当您关闭对话框时，它会自动删除。将 preserveScope: true 添加到您的对话框配置中，这样它就不会在您关闭对话框后被删除。

文档：https://material.angularjs.org/HEAD/api/service/$mdDialog

包裹在 md-dialog 控制器中的 md-dialog 功能障碍触发按钮

Md-dialog dysfunction trigger button wrapped within md-dialog controller

angularjs

mddialog