javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(ionTab): make it so tabNav works with ngRepeat

Browse Source
This commit is contained in:
Andy Joslin
2014-04-30 08:43:06 -06:00
parent 5cdc76aa62
commit 288d4ac230
3 changed files with 21 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
js/angular/directive/tab.js vendored
View File

@@ -56,12 +56,10 @@ function($rootScope, $animate, $ionicBind, $compile) {
element[0].querySelector('data-ion-nav-view');
var navViewName = navView && navView.getAttribute('name');
//We create the tabNavElement in the compile phase so that the
//We create the tabNavTemplate in the compile phase so that the
//attributes we pass down won't be interpolated yet - we want
//to pass down the 'raw' versions of the attributes
var tabNavElement = angular.element(
'<ion-tab-nav' +
var tabNavTemplate = '<ion-tab-nav' +
attrStr('ng-click', attr.ngClick) +
attrStr('title', attr.title) +
attrStr('icon', attr.icon) +
@@ -69,8 +67,7 @@ function($rootScope, $animate, $ionicBind, $compile) {
attrStr('icon-off', attr.iconOff) +
attrStr('badge', attr.badge) +
attrStr('badge-style', attr.badgeStyle) +
'></ion-tab-nav>'
);
'></ion-tab-nav>';
//Remove the contents of the element so we can compile them later, if tab is selected
//We don't use regular transclusion because it breaks element inheritance
@@ -113,6 +110,7 @@ function($rootScope, $animate, $ionicBind, $compile) {
}
}
var tabNavElement = angular.element(tabNavTemplate);
tabNavElement.data('$ionTabsController', tabsCtrl);
tabNavElement.data('$ionTabController', tabCtrl);
tabsCtrl.$tabsElement.append($compile(tabNavElement)($scope));

2
js/angular/directive/tabNav.js vendored
View File

@@ -26,7 +26,7 @@ IonicModule
tabCtrl = ctrls[1];
//Remove title attribute so browser-tooltip does not apear
$element[0].removeAttribute('title');
// $element[0].removeAttribute('title');
$scope.selectTab = function(e) {
e.preventDefault();

31
test/html/tabs-repeat.html
View File

@@ -8,26 +8,27 @@
<script src="../../../../dist/js/ionic.bundle.js"></script>
</head>
<body ng-init="pages=[
{'id':'first',
'icon':'ion-link'
},
{'id':'first',
'icon':'ion-link'
},
{'id':'second',
'icon':'icon ion-link'
{'id':'second',
'icon':'icon ion-link'
},
},
{'id':'third',
'icon':'ion-link'
{'id':'third',
'icon':'ion-link'
}
}
]">
<ion-tabs tabs-style="tabs-top tabs-positive tabs-icon-top">
<ion-tab ng-repeat="p in pages" title="{{p.id}}" icon="{{p.icon}}">
<header class="bar bar-positive bar-header"></header>
<ion-content class="has-header has-subheader">
<p></p>
]">
<ion-tabs class="tabs-top tabs-positive tabs-icon-top">
<ion-tab ng-repeat="p in pages" title="{{p.id}}" icon="{{p.icon}}">
<ion-header-bar class="bar-positive">
<h1 class="title">Hello</h1>
</ion-header-bar>
<ion-content>
<b>{{p.id}}</b>
<p>...</p>
<p>...</p>