Skip to content
This repository has been archived by the owner on May 29, 2019. It is now read-only.

feat(modal): support $uibModalInstance #4661

Closed
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions src/modal/docs/demo.js
Original file line number Diff line number Diff line change
Expand Up @@ -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');
};
});
2 changes: 1 addition & 1 deletion src/modal/docs/readme.md
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
15 changes: 12 additions & 3 deletions src/modal/modal.js
Original file line number Diff line number Diff line change
Expand Up @@ -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) {
Expand Down Expand Up @@ -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++];
});
Expand Down
33 changes: 17 additions & 16 deletions src/modal/test/modal.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -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');
});
Expand Down Expand Up @@ -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);
Expand Down Expand Up @@ -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);
Expand Down