diff --git a/src/ng/directive/ngSwitch.js b/src/ng/directive/ngSwitch.js index aa04a9981521..88b1e70130fa 100644 --- a/src/ng/directive/ngSwitch.js +++ b/src/ng/directive/ngSwitch.js @@ -6,13 +6,16 @@ * @restrict EA * * @description - * Conditionally change the DOM structure. + * Conditionally change the DOM structure. Elements within ngSwitch but without + * ngSwitchWhen or ngSwitchDefault directives will be preserved at the location + * as specified in the template * * @usageContent * ... * ... * ... * ... + * ... * * @scope * @param {*} ngSwitch|on expression to match against ng-switch-when. @@ -26,6 +29,7 @@ * are multiple default cases, all of them will be displayed when no other * case match. * + * * @example @@ -90,9 +94,9 @@ var ngSwitchDirective = valueFn({ forEach(selectedTranscludes, function(selectedTransclude) { var selectedScope = scope.$new(); selectedScopes.push(selectedScope); - selectedTransclude(selectedScope, function(caseElement) { + selectedTransclude.transclude(selectedScope, function(caseElement) { selectedElements.push(caseElement); - element.append(caseElement); + selectedTransclude.element.after(caseElement); }); }); } @@ -107,7 +111,7 @@ var ngSwitchWhenDirective = ngDirective({ compile: function(element, attrs, transclude) { return function(scope, element, attr, ctrl) { ctrl.cases['!' + attrs.ngSwitchWhen] = (ctrl.cases['!' + attrs.ngSwitchWhen] || []); - ctrl.cases['!' + attrs.ngSwitchWhen].push(transclude); + ctrl.cases['!' + attrs.ngSwitchWhen].push({ transclude: transclude, element: element }); }; } }); @@ -119,7 +123,7 @@ var ngSwitchDefaultDirective = ngDirective({ compile: function(element, attrs, transclude) { return function(scope, element, attr, ctrl) { ctrl.cases['?'] = (ctrl.cases['?'] || []); - ctrl.cases['?'].push(transclude); + ctrl.cases['?'].push({ transclude: transclude, element: element }); }; } }); diff --git a/test/ng/directive/ngSwitchSpec.js b/test/ng/directive/ngSwitchSpec.js index b817386cfa74..85240b19bd5a 100644 --- a/test/ng/directive/ngSwitchSpec.js +++ b/test/ng/directive/ngSwitchSpec.js @@ -95,6 +95,68 @@ describe('ngSwitch', function() { })); + it('should always display the elements that do not match a switch', + inject(function($rootScope, $compile) { + element = $compile( + '')($rootScope); + $rootScope.$apply(); + expect(element.text()).toEqual('always other, other too '); + $rootScope.select = 1; + $rootScope.$apply(); + expect(element.text()).toEqual('always one '); + })); + + + it('should display the elements that do not have ngSwitchWhen nor ' + + 'ngSwitchDefault at the position specified in the template, when the ' + + 'first and last elements in the ngSwitch body do not have a ngSwitch* ' + + 'directive', inject(function($rootScope, $compile) { + element = $compile( + '')($rootScope); + $rootScope.$apply(); + expect(element.text()).toEqual('135678'); + $rootScope.select = 1; + $rootScope.$apply(); + expect(element.text()).toEqual('12368'); + })); + + + it('should display the elements that do not have ngSwitchWhen nor ' + + 'ngSwitchDefault at the position specified in the template when the ' + + 'first and last elements in the ngSwitch have a ngSwitch* directive', + inject(function($rootScope, $compile) { + element = $compile( + '')($rootScope); + $rootScope.$apply(); + expect(element.text()).toEqual('3567'); + $rootScope.select = 1; + $rootScope.$apply(); + expect(element.text()).toEqual('236'); + })); + + it('should call change on switch', inject(function($rootScope, $compile) { element = $compile( '' +