ng:view should propagate evals to the current child scope

- this change is needed because of previously reverted $route changes
  that used to propagate evals automatically.
- also added docs to highlight how the eval propagation works

2 files changed, 44 insertions, 16 deletions

diff --git a/src/widgets.js b/src/widgets.js
index c131b646..f90b29a9 100644
--- a/src/widgets.js
+++ b/src/widgets.js
@@ -629,6 +629,9 @@ angularWidget('ng:include', function(element){
       function incrementChange(){ changeCounter++;}
       this.$watch(srcExp, incrementChange);
       this.$watch(scopeExp, incrementChange);
+
+      // note that this propagates eval to the current childScope, where childScope is dynamically
+      // bound (via $route.onChange callback) to the current scope created by $route
       scope.$onEval(function(){
         if (childScope && !preventRecursion) {
           preventRecursion = true;
@@ -1009,24 +1012,35 @@ angularWidget('ng:view', function(element) {
   if (!element[0]['ng:compiled']) {
     element[0]['ng:compiled'] = true;
     return injectService(['$xhr.cache', '$route'], function($xhr, $route, element){
+      var parentScope = this,
+          childScope;
+
       $route.onChange(function(){
-        var src, scope;
+        var src;
 
         if ($route.current) {
           src = $route.current.template;
-          scope = $route.current.scope;
+          childScope = $route.current.scope;
         }
 
         if (src) {
           $xhr('GET', src, function(code, response){
             element.html(response);
-            compiler.compile(element)(element, scope);
-            scope.$init();
+            compiler.compile(element)(element, childScope);
+            childScope.$init();
           });
         } else {
           element.html('');
         }
       });
+
+      // note that this propagates eval to the current childScope, where childScope is dynamically
+      // bound (via $route.onChange callback) to the current scope created by $route
+      parentScope.$onEval(function() {
+        if (childScope) {
+          childScope.$eval();
+        }
+      });
     });
   } else {
     this.descend(true);
diff --git a/test/widgetsSpec.js b/test/widgetsSpec.js
index 7faa9ced..0eabc738 100644
--- a/test/widgetsSpec.js
+++ b/test/widgetsSpec.js
@@ -788,26 +788,25 @@ describe("widget", function(){
 
 
   describe('ng:view', function() {
-    var rootScope, partialScope, $route, $location, $browser;
+    var rootScope, rootScope, $route, $location, $browser;
 
     beforeEach(function() {
-      rootScope = angular.scope();
-      partialScope = angular.compile('<ng:view></ng:view>', rootScope);
-      partialScope.$init();
+      rootScope = angular.compile('<ng:view></ng:view>');
+      rootScope.$init();
       $route = rootScope.$service('$route');
       $location = rootScope.$service('$location');
       $browser = rootScope.$service('$browser');
     });
 
     afterEach(function() {
-      dealoc(partialScope);
+      dealoc(rootScope);
     });
 
 
-    it('should do nothing when not routes are defined', function() {
+    it('should do nothing when no routes are defined', function() {
       $location.updateHash('/unknown');
       rootScope.$eval();
-      expect(partialScope.$element.text()).toEqual('');
+      expect(rootScope.$element.text()).toEqual('');
     });
 
 
@@ -815,19 +814,19 @@ describe("widget", function(){
       $route.when('/foo', {controller: angular.noop, template: 'myUrl1'});
       $route.when('/bar', {controller: angular.noop, template: 'myUrl2'});
 
-      expect(partialScope.$element.text()).toEqual('');
+      expect(rootScope.$element.text()).toEqual('');
 
       $location.updateHash('/foo');
       $browser.xhr.expectGET('myUrl1').respond('<div>{{1+3}}</div>');
       rootScope.$eval();
       $browser.xhr.flush();
-      expect(partialScope.$element.text()).toEqual('4');
+      expect(rootScope.$element.text()).toEqual('4');
 
       $location.updateHash('/bar');
       $browser.xhr.expectGET('myUrl2').respond('angular is da best');
       rootScope.$eval();
       $browser.xhr.flush();
-      expect(partialScope.$element.text()).toEqual('angular is da best');
+      expect(rootScope.$element.text()).toEqual('angular is da best');
     });
 
     it('should remove all content when location changes to an unknown route', function() {
@@ -837,11 +836,26 @@ describe("widget", function(){
       $browser.xhr.expectGET('myUrl1').respond('<div>{{1+3}}</div>');
       rootScope.$eval();
       $browser.xhr.flush();
-      expect(partialScope.$element.text()).toEqual('4');
+      expect(rootScope.$element.text()).toEqual('4');
 
       $location.updateHash('/unknown');
       rootScope.$eval();
-      expect(partialScope.$element.text()).toEqual('');
+      expect(rootScope.$element.text()).toEqual('');
+    });
+
+    it('should chain scopes and propagate evals to the child scope', function() {
+      $route.when('/foo', {controller: angular.noop, template: 'myUrl1'});
+      rootScope.parentVar = 'parent';
+
+      $location.updateHash('/foo');
+      $browser.xhr.expectGET('myUrl1').respond('<div>{{parentVar}}</div>');
+      rootScope.$eval();
+      $browser.xhr.flush();
+      expect(rootScope.$element.text()).toEqual('parent');
+
+      rootScope.parentVar = 'new parent';
+      rootScope.$eval();
+      expect(rootScope.$element.text()).toEqual('new parent');
     });
   });
 });