diff --git a/js/ext/angular/src/directive/ionicTabBar.js b/js/ext/angular/src/directive/ionicTabBar.js index 9ee94fff64..d950cbc7e0 100644 --- a/js/ext/angular/src/directive/ionicTabBar.js +++ b/js/ext/angular/src/directive/ionicTabBar.js @@ -245,6 +245,7 @@ function($scope, $ionicViewService, $rootScope, $element) { * @param {expression=} badge-style The style of badge to put on this tab (eg tabs-positive). * @param {expression=} on-select Called when this tab is selected. * @param {expression=} on-deselect Called when this tab is deselected. + * @param {expression=} ng-click By default, the tab will be selected on click. If ngClick is set, it will not. You can explicitly switch tabs using {@link ionic.controller:ionicTabs#select ionicTabBar controller's select method}. */ .directive('ionTab', ['$rootScope', '$animate', '$ionicBind', '$compile', '$ionicViewService', function($rootScope, $animate, $ionicBind, $compile, $ionicViewService) { @@ -297,6 +298,7 @@ function($rootScope, $animate, $ionicBind, $compile, $ionicViewService) { tabNavElement = angular.element( '' + + ' class="tab-item">' + '{{badge}}' + '' + '' + @@ -363,6 +365,14 @@ function($rootScope, $animate, $ionicBind, $compile, $ionicViewService) { var tabsCtrl = ctrls[0], tabCtrl = ctrls[1]; + $scope.selectTab = function(e) { + e.preventDefault(); + tabsCtrl.select(tabCtrl.$scope, true); + }; + if (!$attrs.ngClick) { + $ionicNgClick($scope, $element, 'selectTab($event)'); + } + $scope.getIconOn = function() { return $scope.iconOn || $scope.icon; }; @@ -373,11 +383,7 @@ function($rootScope, $animate, $ionicBind, $compile, $ionicViewService) { $scope.isTabActive = function() { return tabsCtrl.selectedTab() === tabCtrl.$scope; }; - $scope.selectTab = function(e) { - e.preventDefault(); - tabsCtrl.select(tabCtrl.$scope, true); - }; }; } }; -}); +}]); diff --git a/js/ext/angular/test/directive/ionicTabBar.unit.js b/js/ext/angular/test/directive/ionicTabBar.unit.js index fd150a4831..6eb8ae802c 100644 --- a/js/ext/angular/test/directive/ionicTabBar.unit.js +++ b/js/ext/angular/test/directive/ionicTabBar.unit.js @@ -292,13 +292,14 @@ describe('tabs', function() { }); it('should compile a with all of the relevant attrs', function() { - setup('title=1 icon-on=2 icon-off=3 badge=4 badge-style=5'); + setup('title=1 icon-on=2 icon-off=3 badge=4 badge-style=5 ng-click=6'); var navItem = angular.element(tabsEl[0].querySelector('.tab-item')); expect(navItem.attr('title')).toEqual('1'); expect(navItem.attr('icon-on')).toEqual('2'); expect(navItem.attr('icon-off')).toEqual('3'); expect(navItem.attr('badge')).toEqual('4'); expect(navItem.attr('badge-style')).toEqual('5'); + expect(navItem.attr('ng-click')).toEqual('6'); expect(navItem.parent()[0]).toBe(tabsCtrl.$tabsElement[0]); }); @@ -437,12 +438,20 @@ describe('tabs', function() { }); - it('should select tab on click', function() { + it('should select tab on click by default', function() { var el = setup(); el.triggerHandler('click'); expect(tabsCtrl.select).toHaveBeenCalledWith(tabCtrl.$scope, true); }); + it('should use ngClick if defined', function() { + var el = setup('ng-click="doSomething()"'); + el.scope().doSomething = jasmine.createSpy('doSomething'); + el.triggerHandler('click'); + expect(tabsCtrl.select).not.toHaveBeenCalled(); + expect(el.scope().doSomething).toHaveBeenCalled(); + }); + it('should have title and only title', function() { var el = setup('title="hi, {{name}}!"'); expect(el.find('.tab-title').html()).toBe('hi, !');