In my angular-ionic application I would like to add a subtitle (similar to 'Alphabetic') below the view-title. Is this possible, or is there any workaround on the web?
Right now, my template looks like this: (I've tried adding view-subtitle="test" next to view-title, but no luck so far)
<ion-view view-title="Problems">
<ion-content>
</ion-content>
</ion-view>
Thanks in advance.
There are quite a few ways to customize Headers. A secondary header bar can also be placed below the original header bar using Ionic's CSS Sub Header component and this achieves a very similar look. http://ionicframework.com/docs/components/#subheader
<ion-header-bar class="bar-dark" align-title="center">
<button class="button button-icon" ng-click="toggleCompanies()">
<i class="icon ion-navicon"></i>
</button>
<h1 class="title large">Employees</h1>
</ion-header-bar>
<ion-header-bar class="bar-dark bar-subheader">
<div class="small">Alphabetic</div>
</ion-header-bar>
Apply Some CSS style
.small {
font-size: 14px;
text-align: center;
}
Plunker example here: http://embed.plnkr.co/LOxXsc/preview