离子：视图 - 副标题

Question

在我的角度离子应用程序中，我想在视图标题下面添加一个副标题（类似于'字母'）。这是可能的，还是在网上有任何解决方法？

现在，我的模板如下所示： （我尝试在view-title旁边添加view-subtitle =“test”，但到目前为止没有运气）

<ion-view view-title="Problems">
  <ion-content>
  </ion-content>
</ion-view>

提前致谢。

Answer 1

<ion-view title="<div class='main-title' style='line-height: 1.6;'>Main Title</div><div class='sub-title' style='line-height: .6;font-size: 12px;color: #333;'>Sub Title</div>">

<ion-content>
...
</ion-content>

</ion-view>

Output Image snap

Answer 2

有很多方法可以自定义标题。使用Ionic的CSS Sub Header组件，也可以在原始标题栏下方放置辅助标题栏，这样可以实现非常相似的外观。 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>

应用一些CSS样式

.small {
  font-size: 14px;
  text-align: center;
}

此处的Plunker示例：http://embed.plnkr.co/LOxXsc/preview