Question

app.html

<ion-header>
    <ion-navbar>
        <ion-title>Blabla</ion-title>
        <button ion-button color="primary" (click)="home()">Home</button>
        <button ion-button color="primary" (click)="second()">Second</button>
    </ion-navbar>
</ion-header>
<ion-content>
</ion-content>
<ion-nav #myNav [root]="rootPage"></ion-nav>

app.component.ts

import { Component, ViewChild } from '@angular/core';
import { Platform, NavController } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

import { HomePage } from '../pages/home/home';
import { SecondpagePage } from '../pages/secondpage/secondpage';
@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  @ViewChild('myNav') nav: NavController;
  rootPage:any = HomePage;

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      statusBar.styleDefault();
      splashScreen.hide();
    });
  }

  home() {
    this.nav.setRoot(HomePage);
  }

  second() {
    this.nav.setRoot(SecondpagePage);
  }

}

在HomePage和SecondPage中，我只放了<ion-content>Test1</ion-content>和<ion-content>Test2</ion-content>。现在我有这种情况 - 标题＆＃34;涵盖＆＃34;其余的部分。所以我没有看到任何文字，因为它低于标题。我该如何改变这种行为？而且我还想使用一个静态不可移动的标题/导航栏（因为会有一个动画）。因此，可以更改的内容位于该标题/导航栏下。

Answer 1

尝试将ion-nav移动到ion-content，这样可以使其正常运行。

离子页面 - 改变内容

1 个答案: