關閉按鈕在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") 
});