Merge pull request #182 from rur/master

New 'resolve' option for defining locals for Dialog controller
likeastore · Apr 23, 2015 · a49848c · a49848c
2 parents 0216d42 + 1ff5d96
commit a49848c
Show file tree

Hide file tree

Showing 11 changed files with 286 additions and 28 deletions.
diff --git a/README.md b/README.md
@@ -96,6 +96,34 @@ ngDialog.open({
 });
 ```
 
+##### ``resolve {Object.<string, function>=}``
+An optional map of dependencies which should be injected into the controller.
+If any of these dependencies are promises, ngDialog will wait for them all to be resolved
+or one to be rejected before the controller is instantiated.
+
+If all the promises are resolved successfully, the values of the resolved promises are
+injected.
+
+The map object
+is:
+- `key` – `{string}`: a name of a dependency to be injected into the controller.
+- `factory` - `{string|function}`: If `string` then it is an alias for a service.
+  Otherwise if function, then it is injected using `$injector.invoke` and the return
+  value is treated as the dependency. If the result is a promise, it is resolved
+  before its value is injected into the controller.
+
+
+```javascript
+ngDialog.open({
+	controller: function Ctrl(dep) {/*...*/},
+	resolve: {
+		dep: function depFactory() {
+			return 'dep value';
+		}
+	}
+});
+```
+
 ##### ``scope {Object}``
 
 Scope object that will be passed to dialog. If you use controller with separate ``$scope`` service this object will be passed to ``$scope.$parent`` param:
@@ -176,7 +204,7 @@ Pass ``false`` to disable template caching. Useful for developing purposes, defa
 
 ##### ``name {String} | {Number}``
 
-Give a name for a dialog instance. It is useful for identifying specific dialog if there are multiple dialog boxes opened. 
+Give a name for a dialog instance. It is useful for identifying specific dialog if there are multiple dialog boxes opened.
 
 ##### ``preCloseCallback {String} | {Function}``
 

diff --git a/bower.json b/bower.json
@@ -1,12 +1,12 @@
 {
   "name": "ngDialog",
-  "version": "0.3.12",
+  "version": "0.3.13",
   "homepage": "https://github.com/likeastore/ngDialog",
   "description": "Modal dialogs and popups provider for Angular.js applications",
   "main": [
-      "js/ngDialog.js",
-      "css/ngDialog.css",
-      "css/ngDialog-theme-default.css"
+    "js/ngDialog.js",
+    "css/ngDialog.css",
+    "css/ngDialog-theme-default.css"
   ],
   "keywords": [
     "angular.js",
@@ -34,5 +34,8 @@
   ],
   "dependencies": {
     "angular": "~1"
+  },
+  "devDependencies": {
+    "angular-mocks": "~1.3.14"
   }
 }
diff --git a/css/ngDialog-theme-default.css b/css/ngDialog-theme-default.css
@@ -37,7 +37,6 @@
 
   100% {
     opacity: 0;
-    display:none;
     -webkit-transform: translateY(-40px);
     transform: translateY(-40px);
   }
@@ -53,7 +52,6 @@
 
   100% {
     opacity: 0;
-    display:none;
     -webkit-transform: translateY(-40px);
     -ms-transform: translateY(-40px);
     transform: translateY(-40px);
@@ -66,8 +64,8 @@
 }
 
 .ngdialog.ngdialog-theme-default.ngdialog-closing .ngdialog-content {
-  -webkit-animation: ngdialog-flyout .5s forwards;
-  animation: ngdialog-flyout .5s forwards;
+  -webkit-animation: ngdialog-flyout .5s;
+  animation: ngdialog-flyout .5s;
 }
 
 .ngdialog.ngdialog-theme-default .ngdialog-content {

diff --git a/css/ngDialog-theme-default.min.css b/css/ngDialog-theme-default.min.css
diff --git a/css/ngDialog.css b/css/ngDialog.css
@@ -15,7 +15,6 @@
 
   100% {
     opacity: 0;
-    display: none;
   }
 }
 
@@ -78,8 +77,8 @@
 
 .ngdialog.ngdialog-closing .ngdialog-overlay {
   -webkit-backface-visibility: hidden;
-  -webkit-animation: ngdialog-fadeout 0.5s forwards;
-  animation: ngdialog-fadeout 0.5s forwards;
+  -webkit-animation: ngdialog-fadeout 0.5s;
+  animation: ngdialog-fadeout 0.5s;
 }
 
 .ngdialog-content {
@@ -91,8 +90,8 @@
 
 .ngdialog.ngdialog-closing .ngdialog-content {
   -webkit-backface-visibility: hidden;
-  -webkit-animation: ngdialog-fadeout 0.5s forwards;
-  animation: ngdialog-fadeout 0.5s forwards;
+  -webkit-animation: ngdialog-fadeout 0.5s;
+  animation: ngdialog-fadeout 0.5s;
 }
 
 .ngdialog-close:before {

diff --git a/css/ngDialog.min.css b/css/ngDialog.min.css
diff --git a/js/ngDialog.js b/js/ngDialog.js
@@ -61,8 +61,8 @@
 
         var globalID = 0, dialogsCount = 0, closeByDocumentHandler, defers = {};
 
-        this.$get = ['$document', '$templateCache', '$compile', '$q', '$http', '$rootScope', '$timeout', '$window', '$controller',
-            function ($document, $templateCache, $compile, $q, $http, $rootScope, $timeout, $window, $controller) {
+        this.$get = ['$document', '$templateCache', '$compile', '$q', '$http', '$rootScope', '$timeout', '$window', '$controller', '$injector',
+            function ($document, $templateCache, $compile, $q, $http, $rootScope, $timeout, $window, $controller, $injector) {
                 var $body = $document.find('body');
                 if (forceBodyReload) {
                     $rootScope.$on('$locationChangeSuccess', function () {
@@ -417,7 +417,18 @@
                         // promise is resolved. Accessing globalID from the below callback would cause weird and buggy behavior (e.g. all dialogs
                         // looking like the last one opened).
                         var localID = globalID;
-                        $q.when(loadTemplate(options.template || options.templateUrl)).then(function (template) {
+                        var resolve = angular.extend({}, options.resolve);
+
+                        angular.forEach(resolve, function (value, key) {
+                            resolve[key] = angular.isString(value) ? $injector.get(value) : $injector.invoke(value, null, null, key);
+                        });
+
+                        $q.all({
+                            template: loadTemplate(options.template || options.templateUrl),
+                            locals: $q.all(resolve)
+                        }).then(function (setup) {
+                            var template = setup.template,
+                                locals = setup.locals;
 
                             $templateCache.put(options.template || options.templateUrl, template);
 
@@ -440,16 +451,19 @@
                             }
 
                             if (options.controller && (angular.isString(options.controller) || angular.isArray(options.controller) || angular.isFunction(options.controller))) {
-                                
+
                                 var ctrl = options.controller;
                                 if (options.controllerAs && angular.isString(options.controllerAs)) {
                                     ctrl += ' as ' + options.controllerAs;
                                 }
-
-                                var controllerInstance = $controller(ctrl, {
-                                    $scope: scope,
-                                    $element: $dialog
-                                });
+
+                                var controllerInstance = $controller(options.controller, angular.extend(
+                                    locals,
+                                    {
+                                        $scope: scope,
+                                        $element: $dialog
+                                    }
+                                ));
                                 $dialog.data('$ngDialogControllerController', controllerInstance);
                             }
 
@@ -646,7 +660,7 @@
                         var $all = document.querySelectorAll('.ngdialog');
 
                         // Reverse order to ensure focus restorationi works as expected
-                        for (var i=$all.length; i>-1; i--) {
+                        for (var i = $all.length - 1; i >= 0; i--) {
                             var dialog = $all[i];
                             privateMethods.closeDialog($el(dialog), value);
                         }
@@ -694,4 +708,4 @@
     }]);
 
     return m;
-}));
+}));