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(
+ '' +
+ '- always
' +
+ '- one
' +
+ '- two
' +
+ '- other,
' +
+ '- other too
' +
+ '
')($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(
+ '' +
+ '- 1
' +
+ '- 2
' +
+ '- 3
' +
+ '- 4
' +
+ '- 5
' +
+ '- 6
' +
+ '- 7
' +
+ '- 8
' +
+ '
')($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(
+ '' +
+ '- 2
' +
+ '- 3
' +
+ '- 4
' +
+ '- 5
' +
+ '- 6
' +
+ '- 7
' +
+ '
')($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(
'' +