材料角度预定义对话框关闭按钮不起作用

Question

我从一些来源尝试了很多方法，但仍然无法解决material angularjs的预定义html对话框的关闭按钮的问题。当我按下对话框的外部区域时，它可以正常关闭。

我使用Batarang Angular 得到的错误消息是cancel is undefined。

var app = angular.module('MyApp', ['ngMaterial', 'ngMessages', 'material.svgAssetsCache'])

app.controller('AppCtrl', function($scope, $mdDialog) {
  $scope.showTermUseDialog = function(ev) {
    $mdDialog.show({
      controller: DialogController,
      contentElement: '#termUseDialog',
      parent: angular.element(document.body),
      targetEvent: ev,
      clickOutsideToClose: true,
      scope: $scope,
      preserveScope: true
    });
  };

  function DialogController($scope, $mdDialog) {
    $scope.hide = function() {
      $mdDialog.hide();
    };

    $scope.cancel = function() {
      $mdDialog.cancel();
    };
  }



});

完整代码可以在这里查看：
http://codepen.io/skylee91/pen/xRoLXo

注意：

如果角度材质版本为 1.1.0，则代码按预期运行。但目前我使用的是最新的稳定版本 1.1.1，关闭按钮不会触发 ng-click 事件。

解决方案

1. 目前没有针对 1.1.1 版稳定版的解决方案，因为“预渲染的对话框不会链接到任何范围，也不会实例化新的控制器。”
2. 目前我使用角模板对话框来解决这个问题。

Answer 1

您必须将范围和保留范围添加到 showTermUseDialog $scope.showTermUseDialog = function(ev) { $mdDialog.show({ controller: DialogController, contentElement: '#termUseDialog', parent: angular.element(document.body), targetEvent: ev, clickOutsideToClose: true, scope: $scope, preserveScope: true }); };

并且还在html中添加一个close调用； ng-click="close()"

请在此处查看 plnkr：http://plnkr.co/edit/c1tCfQVMcyj7ZtKRiTOa?p=preview