mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
feat(ionTab): add class attribute to tab items
This commit is contained in:
committed by
Andrew Joslin
parent
6af5d68da4
commit
e6f79cc0ff
1
js/angular/directive/tab.js
vendored
1
js/angular/directive/tab.js
vendored
@@ -64,6 +64,7 @@ function($rootScope, $animate, $ionicBind, $compile) {
|
||||
attrStr('icon-off', attr.iconOff) +
|
||||
attrStr('badge', attr.badge) +
|
||||
attrStr('badge-style', attr.badgeStyle) +
|
||||
attrStr('class', attr.class) +
|
||||
'></ion-tab-nav>';
|
||||
|
||||
//Remove the contents of the element so we can compile them later, if tab is selected
|
||||
|
||||
5
js/angular/directive/tabNav.js
vendored
5
js/angular/directive/tabNav.js
vendored
@@ -6,7 +6,7 @@ IonicModule
|
||||
require: ['^ionTabs', '^ionTab'],
|
||||
template:
|
||||
'<a ng-class="{\'tab-item-active\': isTabActive(), \'has-badge\':badge}" ' +
|
||||
' class="tab-item">' +
|
||||
' class="tab-item {{class}}">' +
|
||||
'<span class="badge {{badgeStyle}}" ng-if="badge">{{badge}}</span>' +
|
||||
'<i class="icon {{getIconOn()}}" ng-if="getIconOn() && isTabActive()"></i>' +
|
||||
'<i class="icon {{getIconOff()}}" ng-if="getIconOff() && !isTabActive()"></i>' +
|
||||
@@ -18,7 +18,8 @@ IonicModule
|
||||
iconOn: '@',
|
||||
iconOff: '@',
|
||||
badge: '=',
|
||||
badgeStyle: '@'
|
||||
badgeStyle: '@',
|
||||
class: '@'
|
||||
},
|
||||
compile: function(element, attr, transclude) {
|
||||
return function link($scope, $element, $attrs, ctrls) {
|
||||
|
||||
@@ -390,13 +390,14 @@ describe('tabs', function() {
|
||||
});
|
||||
|
||||
it('should compile a <ion-tab-nav> with all of the relevant attrs', function() {
|
||||
setup('title="{{a}}" icon-on="{{b}}" icon-off="{{c}}" badge="d" badge-style="{{e}}" ng-click="click"');
|
||||
setup('title="{{a}}" icon-on="{{b}}" icon-off="{{c}}" badge="d" badge-style="{{e}}" class="{{f}}" ng-click="click"');
|
||||
angular.extend(tabEl.scope(), {
|
||||
a: 'title',
|
||||
b: 'on',
|
||||
c: 'off',
|
||||
d: 6,
|
||||
e: 'badger'
|
||||
e: 'badger',
|
||||
f: 'class'
|
||||
});
|
||||
tabEl.scope().$apply();
|
||||
var navItem = angular.element(tabsEl[0].querySelector('.tab-item'));
|
||||
@@ -405,6 +406,7 @@ describe('tabs', function() {
|
||||
expect(navItem.isolateScope().iconOff).toEqual('off');
|
||||
expect(navItem.isolateScope().badge).toEqual(6);
|
||||
expect(navItem.isolateScope().badgeStyle).toEqual('badger');
|
||||
expect(navItem.isolateScope().class).toEqual('class');
|
||||
expect(navItem.attr('ng-click')).toEqual('click');
|
||||
|
||||
angular.extend(tabEl.scope(), {
|
||||
@@ -412,7 +414,8 @@ describe('tabs', function() {
|
||||
b: 'on2',
|
||||
c: 'off2',
|
||||
d: 7,
|
||||
e: 'badger2'
|
||||
e: 'badger2',
|
||||
f: 'class2'
|
||||
});
|
||||
tabEl.scope().$apply();
|
||||
expect(navItem.isolateScope().title).toEqual('title2');
|
||||
@@ -420,6 +423,7 @@ describe('tabs', function() {
|
||||
expect(navItem.isolateScope().iconOff).toEqual('off2');
|
||||
expect(navItem.isolateScope().badge).toEqual(7);
|
||||
expect(navItem.isolateScope().badgeStyle).toEqual('badger2');
|
||||
expect(navItem.isolateScope().class).toEqual('class2');
|
||||
|
||||
expect(navItem.parent()[0]).toBe(tabsCtrl.$tabsElement[0]);
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user