在Ionic 1中，我們可以定義<ion-nav-bar>上方的<ion-nav-view>，用作整個應用程序的通用導航欄，我們可以按視圖將其關閉（使用ionNavView的）hideNavBar=true|false。它出現在Ionic 2中，我們必須<ion-nav-bar>每頁插入一個-不能在整個應用程序中使用全局導航欄。是正確的，還是我錯過了一個把戲？如果是這樣-似乎有很多重復的代碼？另外，您似乎沒有能力讓NavBar構建自己的后退按鈕，并且您必須自己為后退按鈕編寫標記（每頁），這又像是很多重復的代碼。
3 回答
哆啦的時光機
TA貢獻1779條經驗 獲得超6個贊
對于離子3+
我要做的只是使用自定義組件。
ionic generate component navbar
將相關的導航欄html添加到您的組件模板中
將任何其他功能添加到組件.ts文件
將您的選擇器修改為相關的內容（如果使用上面的命令，則應將其默認為“ navbar”。
還將組件添加到您的app.module.ts聲明中
然后，在任何頁面模板中，只需將其用作自定義元素即可，例如
<navbar></navbar><ion-content padding> ...</ion-content/>
一只萌萌小番薯
TA貢獻1795條經驗 獲得超7個贊
創建Ionic 4+應用程序（@ ionic / angular 4.6.2）時遇到了類似的問題，我想在標題中添加一個登錄按鈕和一些其他全局性的東西。
您可以通過非常簡單的方式來實現。
只需在app.component.html中添加包含離子工具欄的離子頭作為全局頭，如下所示：
<ion-header class="page-header">
<ion-toolbar id="main-toolbar">
<ion-title>
<ion-label>{{ pageTitle }}</ion-label>
</ion-title>
<!-- add here all the things you need in your header -->
</ion-toolbar></ion-header><ion-router-outlet id="content" main></ion-router-outlet>這里的問題是，如果僅這樣做，“全局標題”將覆蓋任何頁面的內容。因此，有一種解決方法，只需在內容標簽之前的所有頁面頂部添加一個包含一個空離子工具欄的空離子頭，如下所示：
<ion-header> <ion-toolbar></ion-toolbar></ion-header><ion-content> <!-- your content here --></ion-content>
這樣做，“全局標題”將覆蓋頁面標題，并且內容將在頁面標題之后立即開始。
然后，您可以在app.component.ts文件中管理全局頭控件的所有代碼。
我猜如果主標題的高度大于“標準”工具欄的高度，可能會有一些奇怪的行為，但是使用一些不錯的CSS，您應該可以修復它。
此外，此變通辦法與側面菜單配合使用也很好。
希望能幫助到你！
- 3 回答
- 0 關注
- 578 瀏覽
添加回答
舉報
0/150
提交
取消