angularjs - How can I generate title dynamically on ionic framework?

Question

I use ionic pet template. I have a question about pet-detail page, if I would like to have a dynamic title on header, it will not show anything until I reload the page (using web browser), but I think it doesn't make sense since I would like to make an app. Does I miss anything? what can I do?

here is my code as below:

<ion-nav-bar class="bar-positive">
<div class="buttons" ng-controller="BackCtrl">
    <a class="button button-icon icon ion-chevron-left" ng-click="$back()"></a>
</div>
<h1 class="title"> {{ current_pet.name }} </h1>

..

Answer 1

If you happen to be using ion-view, use this:

<ion-nav-title>
    {{ PageTitle }}
</ion-nav-title>

And put it outside your ion-content.

Answer 2

在我的应用程序中，我使用了这个：

<ion-view title="{{Properties.Title}}">

Properties 是我范围内的一个对象（我有一个主控制器），我在每个“内部控制器”上“覆盖”。

Answer 3

如果您正在使用并且只想在输入/文本区域被填充（非空）时在标题栏中显示一个按钮，那么您可以执行以下操作。

<ion-header-bar class="bar-light">
  <h1 class="title">{{$root.Title}}</h1>
  <div class="buttons">
    <button class="button button-clear icon ion-checkmark-round" ng-click="" ng-if="$root.Title"></button>
  </div>
</ion-header-bar>

在“离子含量”内 -

<div class="row>
  <textarea placeholder="" rows="3" maxlength="100" ng-model="$root.Title" ng-trim="false"></textarea>
</div>

否则，仅在标题栏中使用 ng-if="Title" 将不起作用。