如何在另一页中调用页面 - IONIC 2 [英] How do i call a page in another page - IONIC 2

查看:282
本文介绍了如何在另一页中调用页面 - 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.


请告知,我该怎么办?

Please advise, 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

<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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆