离子 - 无法在导航栏上打印标题

Question

我正在使用angular和ionic，我目前无法在导航栏中打印任何标题。

我有一个相当复杂的设置与多个嵌套视图。

这里是国家的名单：

state('app', { 
    cache: false, 
    url: '/app', 
    abstract: true, 
    templateUrl: './sections/menu/menu.tpl.html', 
    controller: 'menuCtrl' 
}).state('app.home', { 
    url: '/home', 
    views: { 
    'appContent': { 
     templateUrl: './sections/menu/pageViewsContainer.tpl.html', 
     controller: 'homeCTRL' 
    }, 
    'Details@app.home': { 
     templateUrl: './sections/home/home.tpl.html' 
    }, 
    'List@app.home': { 
     templateUrl: './sections/List/List.tpl.html' 
    } 
    } 
}).state('app.details', { 
    name: 'appDetails', 
    url: '/:ID', 
    views: { 
    'appContent': { 
     templateUrl: './sections/menu/pageViewsContainer.tpl.html', 
     controller: 'DetailsCtrl' 
    }, 
    'zoneDetails@app.details': { 
     templateUrl: './sections/Details/Details/details.tpl.html' 
    }, 
    'zoneList@app.details': { 
     templateUrl: './sections/List/List.tpl.html' 
    } 
    } 
}); 

我的主（摘要）状态的应用程序，并使用menu.tpl.html看起来像这样：

<ion-side-menus enable-menu-with-back-views="true"> 
<ion-side-menu-content class="custom-central-content"> 
     <ion-nav-bar class="bar-calm custom-header-bar"> 
      <ion-nav-buttons side="left"> 
       <!--<button class="button button-icon button-clear ion-home" menu-toggle="left"></button>--> 
       <button class="button button-icon button-clear ion-home" ui-sref="app.myHouse" id="AppMenuLeftIcon"></button> 
      </ion-nav-buttons> 

      <ion-nav-buttons side="right"> 
       <button class="button button-icon button-clear ion-navicon" menu-toggle="right" id="AppMenuRightIcon"></button> 
      </ion-nav-buttons> 
     </ion-nav-bar> 

     <ion-view ui-view="appContent"></ion-view> 

    </ion-side-menu-content> 

    <ion-side-menu side="right"> 
     <ion-header-bar class="bar-dark"> 
      ..... 

内<ion-view ui-view="appContent"></ion-view>我现在用的模板从pageViewsContainer.tpl.html这是：

<ion-view> 
    <ion-content class="hg-split-page-container"> 
     <div ui-view="List" class="hg-split-page-zone-list has-header" nav-transition="none"></div> 
     <ion-nav-view name="Details" class="hg-split-page-zone-details"></ion-nav-view> 
    </ion-content> 
</ion-view> 

a然后在Details和List里面打印我需要的两个视图。

问题是我需要能够为主（主页）页面设置一个静态标题，但是当我从范围内进入页面的名称时，动态更改它。

问题是我无法以任何方式打印任何标题（纯文本，而不是范围）。

我试着用（在pageViewsContainer.tpl.html）：

<ion-view> 

    <ion-nav-title>View 1</ion-nav-title> 

    <ion-content class="hg-split-page-container"> 
     <div ui-view="List" class="hg-split-page-zone-list has-header" nav-transition="none"></div> 
     <ion-nav-view name="Details" class="hg-split-page-zone-details"></ion-nav-view> 
    </ion-content> 
</ion-view> 

---

<ion-view view-title="View 1"> 

     <ion-content class="hg-split-page-container"> 
      <div ui-view="List" class="hg-split-page-zone-list has-header" nav-transition="none"></div> 
      <ion-nav-view name="Details" class="hg-split-page-zone-details"></ion-nav-view> 
     </ion-content> 
    </ion-view> 

---

以及（内部细节模板）：

<ion-view> 
    <ion-nav-title>View 1</ion-nav-title> 
    <ion-content class="has-footer has-header"> 
    ... 

---

<ion-view view-title="View 1"> 
     <ion-content class="has-footer has-header"> 
     ... 

但没有奏效。

对此提出建议？

Answer 1

原来，我不得不改变我的导航不少，因为我用的是嵌套视图，父母，孩子们完全错误的方式。现在工作正常。

# This should show the navabar everytime the view is entered 
$scope.$on '$ionicView.enter',() -> 
    $ionicNavBarDelegate.showBar true 

Answer 2

尝试添加标题栏里面的标题命令

<ion-view> 
    <ion-header-bar class="bar-stable"> 
    <h1 class="title">View 1</h1> 
    </ion-header-bar> 
<ion-view> 

，或者尝试

<ion-view> 
    <div class="bar bar-header browse-header" align-title="center"> 
    <h1 class="title">View 1</h1> 
</div> 
<ion-content class="has-header"> 
</ion-content> 
</ion-view>