diff --git a/js/angular/directive/navBar.js b/js/angular/directive/navBar.js index a1a0a75e13f..ca520e8ce19 100644 --- a/js/angular/directive/navBar.js +++ b/js/angular/directive/navBar.js @@ -21,8 +21,9 @@ IonicModule.constant('$ionicNavBarConfig', { * We can add buttons depending on the currently visible view using * {@link ionic.directive:ionNavButtons}. * - * Assign an [animation class](/docs/components#animations) to the element to - * enable animated changing of titles (recommended: 'nav-title-slide-ios7') + * Add an [animation class](/docs/components#animations) to the element via the + * `animation` attribute to enable animated changing of titles + * (recommended: 'nav-title-slide-ios7'). * * Note that the ion-nav-bar element will only work correctly if your content has an * ionView around it. @@ -32,7 +33,7 @@ IonicModule.constant('$ionicNavBarConfig', { * ```html * * - * + * * * * @@ -94,7 +95,7 @@ function($ionicViewService, $rootScope, $animate, $compile, $ionicNavBarConfig) compile: function(tElement, tAttrs) { //We cannot transclude here because it breaks element.data() inheritance on compile tElement - .addClass('bar bar-header nav-bar ' + $ionicNavBarConfig.transition) + .addClass('bar bar-header nav-bar') .append( '
' + '
' + @@ -103,6 +104,12 @@ function($ionicViewService, $rootScope, $animate, $compile, $ionicNavBarConfig) '' ); + if (isDefined(tAttrs.animation)) { + tElement.addClass(tAttrs.animation); + } else { + tElement.addClass($ionicNavBarConfig.transition); + } + return { pre: prelink }; function prelink($scope, $element, $attr, navBarCtrl) { navBarCtrl._headerBarView = new ionic.views.HeaderBar({ diff --git a/test/unit/angular/directive/navBar.unit.js b/test/unit/angular/directive/navBar.unit.js index 0cfebca6a6a..f63bdf18049 100644 --- a/test/unit/angular/directive/navBar.unit.js +++ b/test/unit/angular/directive/navBar.unit.js @@ -323,6 +323,12 @@ describe('ionNavBar', function() { var el = setup(); expect(el.hasClass('nav-title-slide-ios7')).toBe(true); }); + + it('should not add transition if animation attribute is defined', function() { + var el = setup('animation="123abc"'); + expect(el.hasClass('123abc')).toBe(true); + expect(el.hasClass('nav-title-slide-ios7')).toBe(false); + }); }); describe('Android', function() { @@ -346,6 +352,12 @@ describe('ionNavBar', function() { // Nav bar titles don't animation by default on Android expect(el.hasClass('no-animation')).toBe(true); }); + + it('should not add transition if animation attribute is defined', function() { + var el = setup('animation="123abc"'); + expect(el.hasClass('123abc')).toBe(true); + expect(el.hasClass('no-animation')).toBe(false); + }); }); }); });