feat(modal): support $uibModalInstance

- Add support for `$uibModalInstance` as a controller local
- Deprecate `$modalInstance` support

Closes #4638
Closes #4661

Author: wesleycho

src/modal/docs/demo.js

@@ -34,18 +34,18 @@ angular.module('ui.bootstrap.demo').controller('ModalDemoCtrl', function ($scope
 // Please note that $modalInstance represents a modal window (instance) dependency.
 // It is not the same as the $uibModal service used above.
 
-angular.module('ui.bootstrap.demo').controller('ModalInstanceCtrl', function ($scope, $modalInstance, items) {
+angular.module('ui.bootstrap.demo').controller('ModalInstanceCtrl', function ($scope, $uibModalInstance, items) {
 
   $scope.items = items;
   $scope.selected = {
     item: $scope.items[0]
   };
 
   $scope.ok = function () {
-    $modalInstance.close($scope.selected.item);
+    $uibModalInstance.close($scope.selected.item);
   };
 
   $scope.cancel = function () {
-    $modalInstance.dismiss('cancel');
+    $uibModalInstance.dismiss('cancel');
   };
 });

src/modal/docs/readme.md

@@ -6,7 +6,7 @@ The `$uibModal` service has only one method: `open(options)` where available opt
 * `templateUrl` - a path to a template representing modal's content
 * `template` - inline template representing the modal's content
 * `scope` - a scope instance to be used for the modal's content (actually the `$uibModal` service is going to create a child scope of a provided scope). Defaults to `$rootScope`
-* `controller` - a controller for a modal instance - it can initialize scope used by modal. Accepts the "controller-as" syntax in the form 'SomeCtrl as myctrl'; can be injected with `$modalInstance`
+* `controller` - a controller for a modal instance - it can initialize scope used by modal. Accepts the "controller-as" syntax in the form 'SomeCtrl as myctrl'; can be injected with `$uibModalInstance`
 * `controllerAs` - an alternative to the controller-as syntax, matching the API of directive definitions. Requires the `controller` option to be provided as well
 * `bindToController` - when used with `controllerAs` & set to `true`, it will bind the $scope properties onto the controller directly
 * `resolve` - members that will be resolved and passed to the controller as locals; it is equivalent of the `resolve` property for AngularJS routes

src/modal/modal.js

@@ -554,8 +554,8 @@ angular.module('ui.bootstrap.modal', ['ui.bootstrap.stackedMap'])
         backdrop: true, //can also be false or 'static'
         keyboard: true
       },
-      $get: ['$injector', '$rootScope', '$q', '$templateRequest', '$controller', '$uibModalStack',
-        function ($injector, $rootScope, $q, $templateRequest, $controller, $modalStack) {
+      $get: ['$injector', '$rootScope', '$q', '$templateRequest', '$controller', '$uibModalStack', '$modalSuppressWarning', '$log',
+        function ($injector, $rootScope, $q, $templateRequest, $controller, $modalStack, $modalSuppressWarning, $log) {
           var $modal = {};
 
           function getTemplatePromise(options) {
@@ -641,7 +641,16 @@ angular.module('ui.bootstrap.modal', ['ui.bootstrap.stackedMap'])
                 //controllers
                 if (modalOptions.controller) {
                   ctrlLocals.$scope = modalScope;
-                  ctrlLocals.$modalInstance = modalInstance;
+                  ctrlLocals.$uibModalInstance = modalInstance;
+                  Object.defineProperty(ctrlLocals, '$modalInstance', {
+                    get: function() {
+                      if (!$modalSuppressWarning) {
+                        $log.warn('$modalInstance is now deprecated. Use $uibModalInstance instead.');
+                      }
+
+                      return modalInstance;
+                    }
+                  });
                   angular.forEach(modalOptions.resolve, function(value, key) {
                     ctrlLocals[key] = tplAndVars[resolveIter++];
                   });

src/modal/test/modal.spec.js

@@ -531,47 +531,47 @@ describe('$uibModal', function () {
 
     describe('controller', function() {
       it('should accept controllers and inject modal instances', function() {
-        var TestCtrl = function($scope, $modalInstance) {
+        var TestCtrl = function($scope, $uibModalInstance) {
           $scope.fromCtrl = 'Content from ctrl';
-          $scope.isModalInstance = angular.isObject($modalInstance) && angular.isFunction($modalInstance.close);
+          $scope.isModalInstance = angular.isObject($uibModalInstance) && angular.isFunction($uibModalInstance.close);
         };
 
         open({template: '<div>{{fromCtrl}} {{isModalInstance}}</div>', controller: TestCtrl});
         expect($document).toHaveModalOpenWithContent('Content from ctrl true', 'div');
       });
 
       it('should accept controllerAs alias', function() {
-        $controllerProvider.register('TestCtrl', function($modalInstance) {
+        $controllerProvider.register('TestCtrl', function($uibModalInstance) {
           this.fromCtrl = 'Content from ctrl';
-          this.isModalInstance = angular.isObject($modalInstance) && angular.isFunction($modalInstance.close);
+          this.isModalInstance = angular.isObject($uibModalInstance) && angular.isFunction($uibModalInstance.close);
         });
 
         open({template: '<div>{{test.fromCtrl}} {{test.isModalInstance}}</div>', controller: 'TestCtrl as test'});
         expect($document).toHaveModalOpenWithContent('Content from ctrl true', 'div');
       });
 
       it('should respect the controllerAs property as an alternative for the controller-as syntax', function() {
-        $controllerProvider.register('TestCtrl', function($modalInstance) {
+        $controllerProvider.register('TestCtrl', function($uibModalInstance) {
           this.fromCtrl = 'Content from ctrl';
-          this.isModalInstance = angular.isObject($modalInstance) && angular.isFunction($modalInstance.close);
+          this.isModalInstance = angular.isObject($uibModalInstance) && angular.isFunction($uibModalInstance.close);
         });
 
         open({template: '<div>{{test.fromCtrl}} {{test.isModalInstance}}</div>', controller: 'TestCtrl', controllerAs: 'test'});
         expect($document).toHaveModalOpenWithContent('Content from ctrl true', 'div');
       });
 
       it('should allow defining in-place controller-as controllers', function() {
-        open({template: '<div>{{test.fromCtrl}} {{test.isModalInstance}}</div>', controller: function($modalInstance) {
+        open({template: '<div>{{test.fromCtrl}} {{test.isModalInstance}}</div>', controller: function($uibModalInstance) {
           this.fromCtrl = 'Content from ctrl';
-          this.isModalInstance = angular.isObject($modalInstance) && angular.isFunction($modalInstance.close);
+          this.isModalInstance = angular.isObject($uibModalInstance) && angular.isFunction($uibModalInstance.close);
         }, controllerAs: 'test'});
         expect($document).toHaveModalOpenWithContent('Content from ctrl true', 'div');
       });
 
       it('should allow usage of bindToController', function() {
-        open({template: '<div>{{test.fromCtrl}} {{test.isModalInstance}}</div>', controller: function($modalInstance) {
+        open({template: '<div>{{test.fromCtrl}} {{test.isModalInstance}}</div>', controller: function($uibModalInstance) {
           this.fromCtrl = 'Content from ctrl';
-          this.isModalInstance = angular.isObject($modalInstance) && angular.isFunction($modalInstance.close);
+          this.isModalInstance = angular.isObject($uibModalInstance) && angular.isFunction($uibModalInstance.close);
         }, controllerAs: 'test', bindToController: true});
         expect($document).toHaveModalOpenWithContent('Content from ctrl true', 'div');
       });
@@ -1201,7 +1201,7 @@ describe('$modal deprecation', function() {
     inject(function($modal, $timeout, $log, $rootScope) {
       spyOn($log, 'warn');
 
-      $modal.open({template: '<div>Foo</div>'});
+      $modal.open({template: '<div>Foo</div>', controller: function($modalInstance) {}});
       $rootScope.$digest();
       $timeout.flush(0);
       expect($log.warn.calls.count()).toBe(0);
@@ -1229,16 +1229,17 @@ describe('$modal deprecation', function() {
         '</div>';
       $templateCache.put('template/modal/window.html', windowTemplate);
 
-      $modal.open({template: '<div>Foo</div>'});
+      $modal.open({template: '<div>Foo</div>', controller: function($modalInstance) {}});
       $rootScope.$digest();
       $timeout.flush(0);
 
-      expect($log.warn.calls.count()).toBe(5);
+      expect($log.warn.calls.count()).toBe(6);
       expect($log.warn.calls.argsFor(0)).toEqual(['$modal is now deprecated. Use $uibModal instead.']);
-      expect($log.warn.calls.argsFor(1)).toEqual(['$modalStack is now deprecated. Use $uibModalStack instead.']);
-      expect($log.warn.calls.argsFor(2)).toEqual(['modal-animation-class is now deprecated. Use uib-modal-animation-class instead.']);
+      expect($log.warn.calls.argsFor(1)).toEqual(['$modalInstance is now deprecated. Use $uibModalInstance instead.']);
+      expect($log.warn.calls.argsFor(2)).toEqual(['$modalStack is now deprecated. Use $uibModalStack instead.']);
       expect($log.warn.calls.argsFor(3)).toEqual(['modal-animation-class is now deprecated. Use uib-modal-animation-class instead.']);
-      expect($log.warn.calls.argsFor(4)).toEqual(['modal-transclude is now deprecated. Use uib-modal-transclude instead.']);
+      expect($log.warn.calls.argsFor(4)).toEqual(['modal-animation-class is now deprecated. Use uib-modal-animation-class instead.']);
+      expect($log.warn.calls.argsFor(5)).toEqual(['modal-transclude is now deprecated. Use uib-modal-transclude instead.']);
 
       $log.warn.calls.reset();
       $compile('<div modal-backdrop></div>')($rootScope);