如何在Ionic 2中调用另一个页面中的页面 [英] How to call a page in another page in Ionic 2

问题描述

我创建了一个名为 footer 的页面，所以我有footer/footer.html，footer.ts，footer.scss.

I have created a page named footer, so I have footer/footer.html, footer.ts, footer.scss.

现在我想在所有其他页面中最后称呼它.我该怎么办?

Now I want to call this in the end in all other pages. How can I do that?

下面是我的footer.ts，我希望它包含在home.html中:

Below is my footer.ts, I want it to be included in home.html:

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

@Component({
  selector: 'page-footer',
  templateUrl: 'footer.html'
})

下面是我的home.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})

home.html

<ion-header>
  <ion-navbar>
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title>Home</ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
  <ion-list>
    <button ion-item *ngFor="let item of items" (click)="itemTapped($event, item)">
      <ion-icon [name]="item.icon" item-start></ion-icon>
      {{item.title}}
      <div class="item-note" item-end>
        {{item.note}}
      </div>
    </button>
  </ion-list>
  <div *ngIf="selectedItem" padding>
    You navigated here from <b>{{selectedItem.title}}</b>
  </div>

  {{serverstatus}}

  <button (click)="abc()">hii</button>

</ion-content>

推荐答案

您可以在离子含量的末尾添加<page-footer> </page-footer.

You can add <page-footer> </page-footer at the end of your ion-content.

<ion-content>
  <ion-list>
    <button ion-item *ngFor="let item of items" (click)="itemTapped($event, item)">
      <ion-icon [name]="item.icon" item-start></ion-icon>
      {{item.title}}
      <div class="item-note" item-end>
        {{item.note}}
      </div>
    </button>
  </ion-list>
  <div *ngIf="selectedItem" padding>
    You navigated here from <b>{{selectedItem.title}}</b>
  </div>

  {{serverstatus}}

  <button (click)="abc()">hii</button>


  <page-footer> </page-footer>
</ion-content>
<!-- ore here -->
<page-footer> </page-footer>

这篇关于如何在Ionic 2中调用另一个页面中的页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！