Tab content is hid


#1

Hi,

I’ve some problems with a view, that’s my view :

And my code:

 <ion-view title="{{navTitle}}">
	<ion-nav-buttons side="left">
          <button class="button button-icon button-clear ion-navicon" ng-click="toggleLeft()"></button>
	</ion-nav-buttons> 
		
	<div class="bar bar-subheader bar-assertive">
		<label class="item-input-wrapper">
			<i class="icon ion-ios7-search placeholder-icon"></i>
			<input type="search" placeholder="Recherche" ng-model="searchFilter" ng-change="scrollTop()">
		</label>
	</div>
	
	<ion-content>
		<ion-tabs class="tabs-top tabs-striped has-subheader">
			<ion-tab title="Indisponible" class="assertive">
				<ion-nav-view name="tab-problems">
					<ion-view view-title="Problèmes">
						<ion-content>
							<h1 class="title">TEST</h1>
						</ion-content>
					</ion-view>
				</ion-nav-view>
			</ion-tab>
			
			<ion-tab title="Injoignable" class="royal">
				<ion-nav-view name="tab-ok">
					<ion-view view-title="Injoignable">
						<ion-content class="">
							
						</ion-content>
					</ion-view>				
				</ion-nav-view>
			</ion-tab>
			
			<ion-tab title="En attente" class="positive">
				<ion-nav-view name="tab-ok">
					<ion-view view-title="En attente">
						<ion-content class="">
							
						</ion-content>
					</ion-view>				
				</ion-nav-view>
			</ion-tab>
		</ion-tabs>
	</ion-content>
</ion-view>

But i can show my title “TEST”… And i don’t know why…

If someone can help me?

Thanks


#2

So you’re first issue is that you’re putting an ion-nav-view inside ion-content. That is where the issue is.


#3

Thanks for your answer!

Arf…

I’ve delete the ion-content but now i have this:

My tab is under the search bar.

<ion-view title="{{navTitle}}">
<ion-nav-buttons side="left">
      <button class="button button-icon button-clear ion-navicon" ng-click="toggleLeft()"></button>
</ion-nav-buttons> 
	
<div class="bar bar-subheader bar-assertive">
	<label class="item-input-wrapper">
		<i class="icon ion-ios7-search placeholder-icon"></i>
		<input type="search" placeholder="Recherche" ng-model="searchFilter" ng-change="scrollTop()">
	</label>
</div>

	
<ion-tabs class="tabs-top tabs-striped has-subheader">
	<ion-tab title="Indisponible" class="assertive">
		<ion-nav-view name="tab-problems">
			<ion-view view-title="Problèmes">
				<ion-content>
					<h1 class="title">TEST</h1>
				</ion-content>
			</ion-view>
		</ion-nav-view>
	</ion-tab>

	<ion-tab title="Injoignable" class="royal">
		<ion-nav-view name="tab-ok">
			<ion-view view-title="Injoignable">
				<ion-content class="">

				</ion-content>
			</ion-view>				
		</ion-nav-view>
	</ion-tab>

	<ion-tab title="En attente" class="positive">
		<ion-nav-view name="tab-ok">
			<ion-view view-title="En attente">
				<ion-content class="">

				</ion-content>
			</ion-view>				
		</ion-nav-view>
	</ion-tab>
</ion-tabs>

#4

i recognized the problem if you adding the ion-view directly to the ion-tab --> create own states to fill the ion-nav-views and it should work


#5

@bengtler Can you give me a example because i don’t understand? :confused:


#6

I found the solution i had <ion-nav-view class=""> before the ion-tabs.
But the last item on my ion-list is cut… I can’t see all the informations…