Vật liệu AngularJS sử dụng $ mdDialog trong chức năng liên kết chỉ thị

Question

Tôi đang cố gắng đặt một Angular Material dialog trong chức năng liên kết của chỉ thị. Về mặt khái niệm, tôi không thấy tại sao điều này sẽ không thể. Theo tài liệu, số $mdDialog.show nằm trên phạm vi và $mdDialog.hide(); nằm trong bộ điều khiển được xác định bởi đối tượng $mdDialog.show. Tôi đã có thể để hộp thoại bật lên — và mặc dù thực hiện closeModal() (tôi có thể nói bởi console.log), $mdDialog.hide() không bao giờ thực hiện và phương thức không bao giờ ẩn.

angular.module('app', ['ngMaterial']) 
    .directive('addLayer', ['$mdDialog', function($mdDialog) { 

     return { 

      template: '<h1 ng-click="openDialog()">Open Dialog</h1><div>alert: {{alert}}</div>', 
      scope: {}, 
      link: function(scope) { 

       scope.alert = ''; 
       scope.addLayerDialog = function() { 

        $mdDialog.show({ 

         parent: angular.element(document.body), 
         templateUrl: {...}, 
         controller: function($scope, $mdDialog) { 

          $scope.hide = function() { 
           $mdDialog.hide(); 

          }; 

          $scope.cancel = function() { 

           $mdDialog.cancel(); 

          }; 

          $scope.answer = function(answer) { 
           console.log($mdDialog.hide('answer')); 
           $mdDialog.hide(answer); 

          }; 
         } 

        }).then(function(answer) { 

         scope.alert = 'You said the information was "' + answer + '".'; 

        }, function() { 

         scope.alert = 'You cancelled the dialog.'; 

        }); 

       }; 

      } 

     }; 
    }]); 

Tại sao tính năng này không hoạt động? Có phải đơn giản là không thể xác định phương thức mdDialog từ trong chỉ thị?

Dưới đây là một Plnkr Tôi đã mày mò với:

http://plnkr.co/edit/qVczPkuZgtL2CCtLRFrH?p=preview

Cảm ơn một bó. Điều này đã khiến tôi phát điên trong vài giờ.

Answer 1

Đã chỉnh sửa: sự cố xảy ra với lớp css "chuyển đổi", nếu bạn xóa nó, ẩn sẽ hoạt động.

Kiểm tra git cho tài liệu góc, có vẻ $ mdDialog sử dụng lớp "chuyển đổi" để hiển thị hộp thoại và "chuyển đổi" để ẩn hộp thoại, vì vậy nếu bạn bao gồm "chuyển đổi" thì nó sẽ vô hiệu hóa ẩn giấu.