关闭按钮在Angular UI Modal中不起作用

Question

在这个PLUNK中我有一个Angular UI Modal和一个关闭它的按钮。该按钮不起作用，因为模态实例没有close方法。

如果删除rendered语句，该按钮将起作用。为什么它不起作用rendered？

这不起作用：

var app = angular.module('app', ['ui.bootstrap']); 

app.controller('myCtl', function($scope,$uibModal) { 

     $scope.openModal = function() { 
      $scope.modalInstance = $uibModal.open({ 
       templateUrl: 'myModalContent.html', 
       scope: $scope 
      }).rendered.then(function() { 
       alert("modal rendered") 
      }); 
     }; 

     $scope.close = function() { 
      $scope.modalInstance.close(); 
     }; 

}) 

这不工作（见PLUNK）：

var app = angular.module('app', ['ui.bootstrap']); 

app.controller('myCtl', function($scope,$uibModal) { 

     $scope.openModal = function() { 
      $scope.modalInstance = $uibModal.open({ 
       templateUrl: 'myModalContent.html', 
       scope: $scope 
      }); 
     }; 

     $scope.close = function() { 
      $scope.modalInstance.close(); 
     }; 

}) 

Answer 1

在第一种情况下，你分配rendered承诺$scopemodalInstance，而不是实例。它适用于如果你做类似的事情（Plunk）：

$scope.modalInstance = $uibModal.open({ 
    templateUrl: 'myModalContent.html', 
    scope: $scope 
}); 
$scope.modalInstance.rendered.then(function() { 
    alert("modal rendered") 
});