Angularjs + Ionic Framework:如何创建显示 ion-tabs 导航但不为其本身定义选项卡的新路线?

2023-12-22

标题很长,但这里有一个更好的解释。

我有一个名为“Login”的模板 html 文件。我在 app.js 中定义了一条路由,如下所示

.state('login', {
  url: '/login',
  templateUrl: 'templates/login.html',
  controller: 'createAccountCtrl'
})

通过使用 ui-sref="login" 我可以从任何地方链接到这个模板,这非常适合我的需求。

然而,主应用程序使用抽象路由“选项卡”来加载包含主导航的选项卡模板。

.state('tab.about', {
  url: '/about',
  views: {
    'about-tab': {
       templateUrl: 'templates/about.html',
       controller: 'aboutCtrl'
     }
   }
})

  <ion-tabs tabs-style="tabs-icon-top" tabs-type="tabs-default">

    <!-- Home Tab -->
    <ion-tab title="Home" icon="icon ion-home" href="#/tab/home">
      <ion-nav-view name="home-tab"></ion-nav-view>
    </ion-tab>

    <!-- Products Tab -->
    <ion-tab title="Earn Points" icon="icon ion-ios7-plus-outline" href="#/tab/retail-store">
      <ion-nav-view name="retail-store-tab"></ion-nav-view>
    </ion-tab>

  </ion-tabs>

我的问题是这样的。我希望登录页面像其他页面一样具有主应用程序的导航。这样,进入登录页面的用户即使没有登录,仍然可以导航到主页或关于页面。但是,我不想显示自己的导航选项卡/图标。

可以将选项卡 html 直接添加到 login.html 模板文件中,也可以隐藏登录图标/选项卡。我愿意接受建议和帮助。谢谢你!


这些选项卡应该有自己的选项卡图标。因此,如果不为其创建选项卡图标,则无法将登录页面放入选项卡抽象视图中。

您不应该将登录页面放在选项卡抽象视图下,而应该为登录页面放置一个单独的选项卡式导航。

将以下视图加载到索引页中。

<ion-view title="'Login'">

<ion-content has-header="true" has-footer="true" padding="true">

Login page content goes here 

</ion-content>

<div class="tabs tabs-icon-left">
  <a class="tab-item" href="#/tab/home">
   Home
  </a>
  <a class="tab-item" href="#/tab/about">
    About
  </a>
</div>

</ion-view>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angularjs + Ionic Framework:如何创建显示 ion-tabs 导航但不为其本身定义选项卡的新路线? 的相关文章

随机推荐