2017-09-01 24 views
1

私はそれが複数のページを持っていることを意味するウェブサイトを構築しています。あなたがクリックして1つのページから別のページに移動できるグローバルナビゲーション。ionic 3つのページから別の角度への移動

今のところ私はホームとセールスという2つのページがあります。販売にホームページを行くから、私のようなものでした:

<ion-icon name="briefcase" style="zoom:3;color:#d31145" [navPush]="optyPage"></ion-icon> 
<ion-label color="kelloggs" style="font-weight: bold">Sales</ion-label> 

をして.TS

import { OpportunitiesPage } from '../opportunities/opportunities' 

@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 
    optyPage = OpportunitiesPage; 

    constructor(public navCtrl: NavController) { 

    } 
} 

に質問optyページからである私はちょうど家に行くために別のnavPushをしますか?またはいくつかの他の推奨された方法?また、家にいる間にホームボタンをクリックすることを心配する必要があるかどうかわかりません。

答えて

0

ホームを再度ナビスタックに戻したくありません。あなたは、単に行うことができます(と私がお勧めすることは)あなたのopportunities.htmlあなたのヘッダー内のBackボタンを与えるion-navbarを追加

<ion-header> 
    <ion-navbar> 
    <ion-title>Your Title</ion-title> 
    </ion-navbar> 
</ion-header> 

に次のコードを追加しています。戻るボタンをクリックすると、navStackのnavPopが実行され、ホームページに戻ります。

+0

それはモバイルアプリケーションのためではなく、別のページに移動するにはクリックすることができる多くの可能なリンクがあるウェブサイト上での良いソリューションです。すべてのリンクは設計要件に従って常に表示されます。 – Vik

+0

ああ、質問をお見逃し、謝罪します。 @Sampathの解決策を提案し、特に 'napPop'を実行するボタンを追加します。 – Sam5487

1

[navPop]ディレクティブを使用できます。

ナビゲーションスタックから現在のページを宣言的にポップする指示。

<ion-content> 

<button ion-button navPop>Go Back</button> 

</ion-content> 

Oficial doc

+0

もし私が両方のページでボタンaとボタンbを持っていれば。だから私はページ上のボタンを押した場合、どのように動作を防止しますか? ? – Vik

+0

ページスタックにページがある場合にのみ機能します。それ以外は何もしません。 – Sampath

+0

1ページ目、2ページ目、3ページ目が最初は1ページ目です.3ページ目に行くと3ページ目から2ページ目に行きます。今度は3ページ目に戻ります。 ページ1からページ3への移行とページ2からページ3への移行の流れはどのようになりますか?あなたの説明に基づいて覚えておいてください。ページに行くときはnavPushをやってください。だから私の場合、初めて行くか戻ってくるかは分かりません。 – Vik

関連する問題