feat(tabs): allow tab badge-style attribute to set badge class

This commit is contained in:
Andy Joslin
2014-02-07 13:16:02 -05:00
parent c41e5371e7
commit b11e0f512b
4 changed files with 35 additions and 21 deletions

View File

@@ -135,7 +135,7 @@ angular.module('ionic.ui.tabs', ['ionic.service.view', 'ionic.ui.bindHtml'])
}])
// Generic controller directive
.directive('tab', ['$ionicViewService', '$rootScope', '$parse', function($ionicViewService, $rootScope, $parse) {
.directive('tab', ['$ionicViewService', '$rootScope', '$parse', '$interpolate', function($ionicViewService, $rootScope, $parse, $interpolate) {
return {
restrict: 'E',
require: '^tabs',
@@ -169,10 +169,14 @@ angular.module('ionic.ui.tabs', ['ionic.service.view', 'ionic.ui.bindHtml'])
// tell any parent nav controller to animate
$scope.animate = $scope.$eval($attr.animate);
var badge = $parse($attr.badge);
$scope.$watch(badge, function(value) {
var badgeGet = $parse($attr.badge);
$scope.$watch(badgeGet, function(value) {
$scope.badge = value;
});
var badgeStyleGet = $interpolate(attr.badgeStyle || '');
$scope.$watch(badgeStyleGet, function(val) {
$scope.badgeStyle = val;
});
var leftButtonsGet = $parse($attr.leftButtons);
$scope.$watch(leftButtonsGet, function(value) {
@@ -246,7 +250,7 @@ angular.module('ionic.ui.tabs', ['ionic.service.view', 'ionic.ui.bindHtml'])
replace: true,
scope: true,
template: '<div class="tabs">' +
'<tab-controller-item icon-title="{{c.title}}" icon="{{c.icon}}" icon-on="{{c.iconOn}}" icon-off="{{c.iconOff}}" badge="c.badge" active="c.isVisible" index="$index" ng-repeat="c in controllers"></tab-controller-item>' +
'<tab-controller-item icon-title="{{c.title}}" icon="{{c.icon}}" icon-on="{{c.iconOn}}" icon-off="{{c.iconOff}}" badge="c.badge" badge-style="c.badgeStyle" active="c.isVisible" index="$index" ng-repeat="c in controllers"></tab-controller-item>' +
'</div>',
link: function($scope, $element, $attr, tabsCtrl) {
$element.addClass($scope.tabsType);
@@ -266,6 +270,7 @@ angular.module('ionic.ui.tabs', ['ionic.service.view', 'ionic.ui.bindHtml'])
iconOn: '@',
iconOff: '@',
badge: '=',
badgeStyle: '=',
active: '=',
tabSelected: '@',
index: '='
@@ -281,7 +286,7 @@ angular.module('ionic.ui.tabs', ['ionic.service.view', 'ionic.ui.bindHtml'])
},
template:
'<a ng-class="{active:active, \'has-badge\':badge}" ng-click="selectTab()" class="tab-item">' +
'<i class="badge" ng-if="badge">{{badge}}</i>' +
'<i class="badge {{badgeStyle}}" ng-if="badge">{{badge}}</i>' +
'<i class="icon {{icon}}" ng-if="icon"></i>' +
'<i class="{{iconOn}}" ng-if="active"></i>' +
'<i class="{{iconOff}}" ng-if="!active"></i>' +