在ionic side菜单标题中显示当前页面的标题

时间:2022-07-01 20:33:33

I have the following code for a side menu in the body of my index.html which works. But I can't figure out how to change the Page Title to display the title of the current page.

我的索引主体中有一个侧边菜单的代码。html工作。但是我不知道如何更改页面标题来显示当前页面的标题。

<ion-side-menus>
    <ion-side-menu-content>
        <ion-nav-view class="has-header"></ion-nav-view>
        <ion-header-bar class="bar-dark">
            <div class="buttons">
                <button class="button icon button-clear ion-navicon-round"
                        ng-click="toggleLeft()"></button>
            </div>
            <h1 class="title">Page Title</h1>
        </ion-header-bar>
    </ion-side-menu-content>
    <ion-side-menu side="left">
        <ion-list>
            <ion-item href="#/dash">Dashboard</ion-item>
        </ion-list>
        <ion-list>
            <ion-item href="#/search">Search</ion-item>
        </ion-list>
    </ion-side-menu>
</ion-side-menus>

NOTE: Use Shrinath's answer and place your content in a <ion-content> tag after the ion-header-bar tag to stop the content being stacked under the header.

注意:使用Shrinath的答案,将内容放在ion-header-bar标签后的 标签中,以阻止内容被堆放在页眉下方。

1 个解决方案

#1


2  

You can use route and for every route define template having different controller.
On Template definition you can choose different Header.

您可以使用路由,并为每个路由定义具有不同控制器的模板。在模板定义上,您可以选择不同的标题。

<ion-header-bar class="bar bar-header bar-dark">
        <h1 class="title">Heading</h1>
      </ion-header-bar>

#1


2  

You can use route and for every route define template having different controller.
On Template definition you can choose different Header.

您可以使用路由,并为每个路由定义具有不同控制器的模板。在模板定义上,您可以选择不同的标题。

<ion-header-bar class="bar bar-header bar-dark">
        <h1 class="title">Heading</h1>
      </ion-header-bar>