How can i put two ion-content tags into one page


#1

i’m trying to build a view with two <ion-list>(in ion-content) tags so that they can be refreshed sepratedly.
but it doesn’t work. is there any thing wrong ?

<ion-view title="policy" animation="slide-left-right-ios7" class="row">
		<ion-content class="col col-33">
			<ion-refresher
			  pulling-text="pull down~"
			  on-refresh="doRefresh()">
			</ion-refresher>
			<ion-list>
			  <ion-item class="item" href="#">
			  	<div class="row cxl-no-padding">
			  		<div class="col">
			  			ddd
			  		</div>
			  		<div class="col">
			  			<span once-text="item.level"></span>
			  		</div>
			  	</div>
			  </ion-item>
			</ion-list>
		</ion-content>		
		<ion-content class="col-66 col">
			<ion-refresher
			  pulling-text="<i class='cxl-font-small'>pull down~</i>"
			  on-refresh="doRefresh()">
			</ion-refresher>
			<ion-list>
			  <ion-item class="item" href="#">
			  	<div class="row cxl-no-padding">
			  		<div class="col">
			  			eee<span once-text="item.customer_name"></span>
			  		</div>
			  		<div class="col">
			  			<span once-text="item.level"></span>
			  		</div>
			  	</div>
			  </ion-item>
			</ion-list>
		</ion-content>

</ion-view>


#2

Take a look at this codepen http://codepen.io/gnomeontherun/pen/mvDbL?editors=101 to see how I setup something like you were asking for.

The main issue is the $scope.$broadcast will close any open ion-refresher that is open. Imagine the left side was pulled to refresh, still spinning, and the right was also then pulled. If the left finishes while both sides are still running, it will close the right as well. IonRefresher doesn’t have a way to target a specific instance if more than one is on the page at once, to my knowledge or the docs.