Question

我使用ionic-nav-bar创建了一个导航栏。添加了h1个元素，其中包含类title。但它没有显示任何内容。

这是我的代码

<ion-pane>
    <ion-nav-bar class="bar-stable">
        <h1 class="title">Ionic Blank Starter</h1>
    </ion-nav-bar>
    <ion-content>
    </ion-content>
</ion-pane>

然而，这是有效的：

<ion-pane>
    <ion-header-bar class="bar-stable">
        <h1 class="title">Ionic Blank Starter</h1>
    </ion-header-bar>
    <ion-content>
    </ion-content>
</ion-pane>

那么我做错了什么？

Answer 1

 <ion-nav-bar class="bar-positive">
 <ion-nav-title>hello</ion-nav-title>
 </ion-nav-bar>

这将解决您的问题。

Answer 2

离子导航条将成为您的导航栏，您将获得将插入离子内容部分的离子视图。如果您有导航栏，则永远不会想要一个标题，因为标题应该在离开视图时导航。创建ion-view标签时，添加view-title属性。然后，当该视图处于活动状态时，它将自动更新标题，不需要h1标记。

离子标题方法有效，因为ion-header被设计为静态而不像导航标题那样动态更新。

Answer 3

这将是您视图的html文件：

<ion-view title='My Title' class="dashboard"> 
    <ion-content>
    </ion-content>
</ion-view>

在你的情况下，你应该将所有这些包装在另一个ion-nav-view - 元素中，因为你正在使用 ion-nav-bar - 。元素

Answer 4

事实是你的

<h1>Test</h1>

显示

标记，但它位于<ion-nav-bar></ion-nav-bar>后面。正如Anand在上面的回答中建议的那样，你应该使用<ion-nav-title>Test</ion-nav-title>来获得预期的结果。

希望这有帮助。

ion-nav-bar不显示任何内容

4 个答案: