/** * @ngdoc directive * @name ionNavBar * @module ionic * @delegate ionic.service:$ionicNavBarDelegate * @restrict E * * @description * If we have an {@link ionic.directive:ionNavView} directive, we can also create an * ``, which will create a topbar that updates as the application state changes. * * We can add a back button by putting an {@link ionic.directive:ionNavBackButton} inside. * * 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') * * @usage * * ```html * * * * * * * * * ``` * * @param {string=} delegate-handle The handle used to identify this navBar * with {@link ionic.service:$ionicNavBarDelegate}. * @param align-title {string=} Where to align the title of the navbar. * Available: 'left', 'right', 'center'. Defaults to 'center'. */ IonicModule .directive('ionNavBar', [ '$ionicViewService', '$rootScope', '$animate', '$compile', function($ionicViewService, $rootScope, $animate, $compile) { return { restrict: 'E', controller: '$ionicNavBar', scope: true, compile: function(tElement, tAttrs) { //We cannot transclude here because it breaks element.data() inheritance on compile tElement .addClass('bar bar-header nav-bar') .append( '
' + '
' + '

' + '
' + '
' ); return { pre: prelink }; function prelink($scope, $element, $attr, navBarCtrl) { navBarCtrl._headerBarView = new ionic.views.HeaderBar({ el: $element[0], alignTitle: $attr.alignTitle || 'center' }); //defaults $scope.backButtonShown = false; $scope.shouldAnimate = true; $scope.isReverse = false; $scope.isInvisible = true; $scope.$on('$destroy', function() { $scope.$parent.$hasHeader = false; }); $scope.$watch(function() { return ($scope.isReverse ? ' reverse' : '') + ($scope.isInvisible ? ' invisible' : '') + (!$scope.shouldAnimate ? ' no-animation' : ''); }, function(className, oldClassName) { $element.removeClass(oldClassName); $element.addClass(className); }); } } }; }]);