refactor(module): strict separation between module-config / app-runtime

4 files changed, 33 insertions, 24 deletions

diff --git a/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc b/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc
index c01b04b1..e98eb5e0 100644
--- a/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc
+++ b/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc
@@ -31,8 +31,9 @@ myController.$inject = ['$location', '$log'];
 <doc:example module="MyServiceModule">
 <doc:source>
 <script type="text/javascript">
-angular.module.MyServiceModule = ['$provide', function($provide){
-  $provide.factory('notify', ['$window', function(win) {
+angular.
+ module('MyServiceModule', []).
+ factory('notify', ['$window', function(win) {
     var msgs = [];
     return function(msg) {
       msgs.push(msg);
@@ -42,7 +43,6 @@ angular.module.MyServiceModule = ['$provide', function($provide){
       }
     };
   }]);
-}];
 
 function myController(notifyService) {
   this.callNotify = function(msg) {
diff --git a/docs/content/guide/dev_guide.services.managing_dependencies.ngdoc b/docs/content/guide/dev_guide.services.managing_dependencies.ngdoc
index 5ca76654..43e5a4ae 100644
--- a/docs/content/guide/dev_guide.services.managing_dependencies.ngdoc
+++ b/docs/content/guide/dev_guide.services.managing_dependencies.ngdoc
@@ -53,7 +53,7 @@ provided by angular's web framework:
   }
 
   // get the main service to kick of the application
-  angular.injector(batchLogModule).get('routeTemplateMonitor');
+  angular.injector([batchLogModule]).get('routeTemplateMonitor');
 </pre>
 
 Things to notice in this example:
diff --git a/docs/content/guide/dev_guide.templates.filters.creating_filters.ngdoc b/docs/content/guide/dev_guide.templates.filters.creating_filters.ngdoc
index a8fd2ce7..98b41411 100644
--- a/docs/content/guide/dev_guide.templates.filters.creating_filters.ngdoc
+++ b/docs/content/guide/dev_guide.templates.filters.creating_filters.ngdoc
@@ -19,8 +19,8 @@ text upper-case and assigns color.
 <doc:example module="MyReverseModule">
 <doc:source>
 <script type="text/javascript">
-  angular.module.MyReverseModule = function ($filterProvider) {
-    $filterProvider.register('reverse', function() {
+  angular.module('MyReverseModule', []).
+    filter('reverse', function() {
       return function(input, uppercase) {
         var out = "";
         for (var i = 0; i < input.length; i++) {
@@ -33,7 +33,6 @@ text upper-case and assigns color.
         return out;
       }
     });
-  }
 
   function Ctrl() {
     this.greeting = 'hello';
diff --git a/docs/src/templates/doc_widgets.js b/docs/src/templates/doc_widgets.js
index c130add8..db49088d 100644
--- a/docs/src/templates/doc_widgets.js
+++ b/docs/src/templates/doc_widgets.js
@@ -22,8 +22,9 @@
     ' </body>\n' +
     '</html>';
 
-  angular.widget('doc:example', ['$injector', '$element', function($injector, element){
-    this.descend(true); //compile the example code
+  angular.widget('doc:example', ['$injector', '$browser', '$location', '$element',
+                        function($injector,    $browser,   $location,   element){
+    this.descend(false); // do not compile the example code
     var module = element.attr('module') || '';
 
     //jQuery find() methods in this widget contain primitive selectors on purpose so that we can use
@@ -38,30 +39,26 @@
         jsfiddle = example.attr('jsfiddle') || true,
         scenario = element.find('pre').eq(1); //doc-scenario
 
-    var tabHtml =
-      '<ul class="doc-example">';
+    var tabs = angular.element('<ul class="doc-example">');
 
     // show source tab, if not disabled
     if (showSource) {
-      tabHtml +=
+      tabs.append(
         '<li class="doc-example-heading"><h3>Source</h3></li>' +
         '<li class="doc-example-source" ng:non-bindable>' +
         jsFiddleButton(jsfiddle) + // may or may not have value
-        '<pre class="brush: js; html-script: true; toolbar: false;"></pre></li>';
+        '<pre class="brush: js; html-script: true; toolbar: false;"></pre></li>');
     }
     // show live preview tab
-    tabHtml +=
-        '<li class="doc-example-heading"><h3>Live Preview</h3></li>' +
-        '<li class="doc-example-live">' + htmlSrc +'</li>';
+    var livePreviewTab;
+    tabs.append('<li class="doc-example-heading"><h3>Live Preview</h3></li>');
+    tabs.append(livePreviewTab = angular.element('<li class="doc-example-live">' + htmlSrc +'</li>'));
     // show scenario tab, if present
     if (scenario.text()) {
-      tabHtml +=
+      tabs.append(
         '<li class="doc-example-heading"><h3>Scenario Test</h3></li>' +
-        '<li class="doc-example-scenario"><pre class="brush: js">' + scenario.text() + '</pre></li>';
+        '<li class="doc-example-scenario"><pre class="brush: js">' + scenario.text() + '</pre></li>');
     }
-    tabHtml +=
-      '</ul>';
-    var tabs = angular.element(tabHtml);
 
     tabs.find('li').eq(1).find('pre').text(
       HTML_TEMPLATE.
@@ -82,10 +79,23 @@
       alert(e);
     }
 
-    if (module) {
-      $injector.invoke(null, angular.module[module]);
-    }
+    return function() {
+      var scope = this;
+      var modules = [
+        'ng',
+        function($provide) {
+          $provide.value('$browser', $browser);
+          $provide.value('$location', $location);
+        }
+      ];
+      module && modules.push(module);
 
+      angular.bootstrap(livePreviewTab, modules).invoke(function($rootScope) {
+        element.bind('$destroy', scope.$root.$watch(function() {
+          $rootScope.$digest();
+        }));
+      });
+    };
 
     function jsFiddleButton(jsfiddle) {
       var fixJsFiddleIssue132 = true;