Angular bootstrap modal controller scope
<p>I'm trying to get modals woking with angular bootstrap. I can launch the modal just fine, but I'm having some scope issues dismissing the modal.</p>

<p>When I launch the modal, I can specify a controller that I can call functions from, which works, but it seems to be a <em>copy</em> of the controller without a $parent and without any controller-local variables.</p>

<p>I need access to the return value of $uibModal.open() in order to close the modal, so I'm trying to store it in var modalInstance, which works fine when I'm within the scope of the controller, but the copy of the controller passed into the $uibModal service doesn't have the local variable modalInstance set.</p>

<p>I can get around this by storing the return object in the $rootScope, but that seems like a bad idea. Am I wrong? What's the best way to get access to modalInstance from the click handler passed into the $uibModal service? Can I avoid using the $rootScope?</p>

<pre><code>var app = angular.module('main', ['ui.bootstrap']);

app.controller('MainCtrl', function($scope, $rootScope, $uibModal) {
  var modalInstance;

  $scope.launch = function() {
    console.log('launch');
    modalInstance = $uibModal.open({
      template: '&lt;div&gt;Modal Content - &lt;a ng-click="close()"&gt;Close&lt;/a&gt;&lt;/div&gt;',
      controller: 'MainCtrl',
    });

    // Wouldn't need to do this if I could access modalInstance in close handler
    $rootScope.modalInstance = modalInstance;
  }

  $scope.close = function () {
    console.log('close');
    console.log(modalInstance);

    // Works, but should I be using $rootScope like this?
    //$rootScope.modalInstance.close();

    // Doesn't work, modalInstance is undefined
    modalInstance.close();
  }
});
</code></pre>