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/