问题标签 [ionic-tabs]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
283 浏览

angular - 在 Ionic 4 中路由到带有选项卡的页面时出错

我收到错误“错误:无法匹配任何路由。URL 段:'admin-home/admin-fixtures' 错误:无法匹配任何路由。URL 段:'admin-home/admin-fixtures'”试图路由到包含标签的页面

我的主页也是一个标签页(最初由 ionic 生成),这就是我要遵循的示例。

这是我认为相关的代码。在我的一个页面 Login.mhtl 我单击一个按钮,将我链接到 admin-home 应该是一个包含 3 个选项卡的页面

这是我的 admin-home.html 的代码

这是 admin-home.router.module.ts

添加 admin-fixture.module.ts 代码

0 投票
2 回答
1981 浏览

ionic-framework - Ionic 4 组件未在导航上呈现

我正在使用 Ionic 4 和 Angular 8 我在我的应用程序底部有以下选项卡,并且希望通过单击选项卡从论坛和消息导航到与选项卡关联的不同组件。但问题是页面不会在单击选项卡时呈现,但如果我刷新页面,则导航工作正常。我不知道我在这里错过了什么。

标签 HTML

TS 文件中的 routesTo('messages') 和 routesTo('forum')。

我在 LandingPageModule 中有一个登录页面,我从该页面直接路由到“共享/主页”,这是“共享”的子路由

有关更多信息,我将基本路由模块设置为:

分享模块的路线如下:

0 投票
1 回答
42 浏览

ionic-framework - 离子选项卡内的离子段未正确显示子页面

我正在为我的 ionic3 应用程序使用 Ionic Tabs 布局。在第一个标签页内,我有 2 个离子段(它们都有自己的页面。)。问题是当我单击第一个离子选项卡时,它会正确显示 2 个段,但任何段的页面内容均未显示。有关详细信息,请访问我发布到 ionic 论坛的以下问题链接。

https://forum.ionicframework.com/t/ionic-segment-inside-ionic-tab-not-displaying-child-page-properly/176151

0 投票
1 回答
579 浏览

angular - 如何将参数从选项卡容器传递到离子 4 中的一个选项卡

我有一个离子标签应用程序,需要将参数从 TabsPage.ts 传递给 Tab2Page.ts 以便在 Tab2Page.html 中使用它。这些选项卡与路由系统一起使用。我四处搜索,但没有发现任何帮助。任何帮助表示赞赏。

标签页.ts:

Tab2Page.ts:

标签页.html:

标签路由器模块:

0 投票
1 回答
6 浏览

angular - 使用模板 TABS 并尝试添加新路由(未找到 HelloworldPageModule 的组件工厂)

我第一次尝试离子。我使用模板 TABS 创建了一个项目,并尝试在底部菜单中添加一个带有新按钮的新页面。我这样做了:

1)离子生成页面helloworld

2)在tabs-routing.module.ts我添加了新路线:

在 tabs.page.html 我添加了

但这是错误: https://aws1.discourse-cdn.com/ionicframework/original/3X/b/e/bebad2c6927130e1c0d733b75ea0b3864e59faa4.png

0 投票
1 回答
505 浏览

angular - Ionic 4 ion-tabs - 错误错误:未捕获(承诺):错误:无法匹配任何路由。网址段:

我的app-routing.module.ts

conv-conversation.html中的 HTML :

这就是我的流程的工作方式:

conversation-tabs重定向到conv-conversation哪个将充当我的标签的“家”。底部conv-conversation.html是上面的 HTML 代码。当我单击conversation-files按钮时,我收到此错误:

ERROR 错误:未捕获(在承诺中):错误:无法匹配任何路由。URL 段:'conversation-tabs/conv-conversation/conversation-files' 错误:无法匹配任何路由。URL 段:'conversation-tabs/conv-conversation/conversation-files'

我不太确定问题是什么,因为我的路由已设置。我错过了什么吗?

0 投票
1 回答
233 浏览

angularjs - 离子 - 导航到具有特定 ID 错误的离子选项卡页面:无法匹配任何路由。网址段:

我正在开发一个具有以下用例的应用程序,我不确定如何实现。

我在显示游戏/比赛结果列表的页面上。当我点击那个特定的游戏时,我想被带到那个游戏的更详细的页面,但是这个详细的页面是一个标签页(上面有 2 个标签)。

这是我的游戏列表页面中的代码:

一旦我点击那个离子卡,我想被带到一个有标签的页面 - 我想 URL 应该看起来像 /match-details/match-details-info/XYZ1234345 但我不知道如何到达那里.

这是我的 match-details-routing.module.ts:

这是我看到的错误

url 对我来说看起来是正确的,但由于某种原因它与路由不匹配。

还包括部分 app-routing.module.ts

0 投票
1 回答
153 浏览

ionic-framework - Ionic 4将数据从标签栏传递到所有标签

我的应用中有五个标签。所有这些选项卡都需要存储在本地存储中的 id。因此,我想从标签栏页面上的本地存储中获取此 ID,并在用户单击相应选项卡时将其发送到所有选项卡。

我不想使用查询参数,因为在 url 中公开 id 是不安全的

编辑我已经将角度路由器的navigationExtras 与click 事件一起使用,它正在工作。但我不确定这是最好的方法。

0 投票
1 回答
538 浏览

angular - Ionic Angular 路由器组件缓存问题

目前,我正在使用 Angular 9(单页应用程序)开发 Ionic 5 应用程序,并且在路由/组件缓存方面遇到了一些问题(至少我是这么认为的),需要一些帮助。我将尽我所能解释我的情况,以便您了解我正在与之斗争的概念和问题。

我有一页上有 2 个<ion-tab-bar>控件/选项卡(活动和非活动)。在“活动”选项卡上,我列出了我的数据库中在数据库中设置了“活动”标志的产品,而在“非活动”上,我列出了相反的产品。在这些选项卡上,产品以面向列表的方式显示,样式为卡片/卡片组件。

单击卡片后,我将用户导航到显示产品详细信息的新页面 (/active/:id)。除其他功能外,还有一个将产品标记为非活动状态的按钮。通过单击此按钮,我正在进行 api 调用,它将产品在数据库中标记为非活动。此外,此页面包含一个<ion-back-button>按钮组件,可让我回到上一页。

问题

我的问题是,当我将产品标记为非活动时,它会更改其在数据库中的状态,但是当我单击后退按钮并返回活动选项卡时,我标记为非活动的产品仍在活动选项卡下,我注意到没有调用任何生命周期方法,也没有执行 api 调用以刷新列表。

在此之后,当我转到非活动选项卡时,现在我的产品显示在此处,当我再次切换到活动选项卡时,它不再位于活动选项卡下,这是我最初所期望的。

这种行为不仅在我浏览后退按钮时发生,而且在我浏览标题导航时也会发生(因此,我认为这与从位置历史中呈现页面无关)。

我在下面发布了一张图片,它在视觉上代表了这个问题。

任何建议/指南将不胜感激。提前致谢。

在此处输入图像描述

0 投票
1 回答
40 浏览

ionic3 - ionic 3 - registerBackButtonAction - 无法获取活动推送页面

我的应用程序导航是这样的:

  • 登录页面(设置为 Root)
  • TabsPage(设置为Root,登录成功后)
    • ListPage(离子标签根)
      • FilterPage(以模式打开)
      • DetailsPage(页面被推送)
    • SearchPage(离子标签根)
    • SettingsPage(离子标签根)
      • 历史(页面被推送)
        • HistoryDe​​tailsPage(页面被推送)

问题有点像这个问题。但这对我没有帮助。

问题:

每当我从推送的页面或 ion-tab 根页面按下硬件后退按钮时,我只会在 app.component.ts 的后退按钮事件中看到 nav.getViews() 的 ["TabsPage"]。如何在该全局后退按钮事件中获取 Pushed Page 的名称?

参考代码:

app.component.ts: