在选项卡中是否可以有模态并在选择另一个选项卡时隐藏?

时间:2019-06-08 01:04:01

标签: angular ionic-framework tabs modal-dialog

我的应用程序使用选项卡显示来显示不同的记录。在每个选项卡上,我们都有可打开模式以显示更多详细信息并允许进行编辑的操作(按钮)。主要是主/子关系中的子记录(例如,联系人记录的地址)。

我们希望“模式”位于选项卡中,以便用户在显示模式时可以在选项卡之间切换;并在选择/激活其他选项卡时隐藏。当用户回到标签页时,将重新显示该模式。

我已经开始对此进行研究,并且希望获得有关如何实现此目标的任何想法。我认为我将不得不创建自己的Web组件,该组件模仿模式并可以包含在选项卡中。

如果有任何区别,我们将使用Angular 8.0。

谢谢, 克里斯...

1 个答案:

答案 0 :(得分:0)

如果应该在选项卡中,为什么不将其实现为出现在按钮单击事件中的普通组件?您可以使用具有绝对位置的简单flex容器创建覆盖图,该容器可以覆盖选项卡主体并将模态组件与选项卡的中心对齐。您可以使用ngIf来控制它,也可以通过隐藏css来控制它,使其始终在后台呈现。

由于叠加层/组件是选项卡的一部分,因此只有在打开该选项卡时才能显示。

如果要加载多个不同的模态,则可以使用ngSwitch或动态加载模态组件来解决。