Angular.ui莫代爾不關閉或取消

Question

我找不到方法來標題這個問題，所以如果你可以建議一個更好的方式，請讓我知道。無論如何，我的問題（S）。

我在用戶想要註銷時實現了一種模式。用戶點擊註銷圖標。圖標調用了一個帶有註銷功能的模態在我的控制器是這樣的：

<li ng-controller="modalController"> 
    <a href="" class="mb-control" ng-click="logout();" ><span class="fa fa-sign-out"></span></a> 
</li> 

我modalController看起來像這樣

app.controller('modalController', ['$scope', '$location', '$uibModal', '$log', function($scope, $location, $uibModal, $log, $uibModalInstance) { 
    $scope.logout = function(){ 
     $uibModal.open({ 
      templateUrl: 'views/partials/logoutMsg.html' 
     }); 

     $scope.ok = function() { 
      $uibModalInstance.close(); 
      $location.path('/login'); 
     }; 

     $scope.cancel = function() { 
      $uibModalInstance.dismiss(); 
     }; 
    }; 
}]); 

我的模式模板有這它：

<div class="mb-container"> 
    <div class="mb-middle"> 
     <div class="mb-title"><span class="fa fa-sign-out"></span> Log <strong>Out</strong> ?</div> 
     <div class="mb-content"> 
      <p>Are you sure you want to log out?</p> 
      <p>Press No if you want to continue work. Press Yes to logout current user.</p> 
     </div> 
     <div class="mb-footer"> 
      <div class="pull-right"> 
       <button class="btn btn-primary mb-control-close" ng-click="cancel()">No</button> 
       <button ng-click="ok()" class="btn btn-success">Yes</a> 
      </div> 
     </div> 
    </div> 
</div> 

ps我的參考調用Angular Bootstrap和我的控制器在我的index.html中檢查。我在我的angular.module中也包含了ui.bootstrap。實際上，在我的控制檯中沒有錯誤指出任何缺失的依賴關係或注入不良。

的問題

1. 模態做開，但是當我點擊按鈕不會關閉或模式的區域之外。我不僅希望它消失，而且Yes按鈕應該重定向到/ login頁面，並且模式將被解除。 No按鈕只是駁回了模式。在模態區域外單擊也會取消模態。

2. 模態一遍又一遍地打開多次，因爲我點擊註銷圖標。這是偉大的，它會打開它，但一旦足以謝謝你笑

Answer 1

有在你的代碼幾件事情，不工作。

讓我們從最重要的事情開始：爲什麼模態不關閉？。

你ok和cancel方法分配到一個modalController範圍，但你不能傳遞任何範圍的模式，所以它的使用$rootScope並沒有ok和close方法。爲了解決這個問題，你必須一個範圍傳遞給$uibModal.open方法，所以它應該是這樣的：

$uibModal.open({ 
    templateUrl: 'views/partials/logoutMsg.html', 
    scope: $scope //using modalController scope 
}); 

但這並不解決問題。在ok和cancel您指的是$uibModalInstance，但它是undefined。您可能認爲只是將其注入控制器將解決問題，但不會。它不可用於注入 - 如果您將它注入到模式中的控制器中，所以要解決此問題，您需要將$uibModal.open的結果分配給一個變量。

var $uibModalInstance = $uibModal.open(); 

這裏是工作的解決方案

https://jsfiddle.net/zho5k7af/

但是我想一個控制器添加到一個模式，這樣你就不會污染$scope。看我的解決方案。

https://jsfiddle.net/3dhubhrm/1/